问几个样式问题

[-一个大坑]

/* 主表格div */
.mainView {
width: 98%;
height: 66%;
margin-left: 1%;
}

/* 主表格 */
.mainTable {
width: 100%;
height: 100%;
}

/* 主表格tr */
.mainTable tr{
width:100%;
height:10%;
}
为啥我放两行，直接就满了，应该只占了20%，剩下的空着才对呀

[-一个大坑]

字体大小根据页面变化怎么写？font-size: 1.8rem;不知道怎么用好像没效果

[天际的海浪]

你要做什么效果？ 百分比是依据父元素的值而定的。tr的父元素是tbody。tbody没有设置height啊。 字体大小根据页面变化可以用vw这个单位 font-size: 1vw;

[天际的海浪]

另外，一个table中的tr必须是要填满表格的，不能只占据表格的20%

[-一个大坑]

引用 3 楼 天际的海浪 的回复:

另外，一个table中的tr必须是要填满表格的，不能只占据表格的20%

我有一個div，如果一行只占這個div 10%，兩行20%，十行100%，超過十行滾動要怎麼做
/* 主表格div */
.mainView {
overflow: hidden;
width: 98%;
height: 98%;
}

/* 主表格 */
.mainTable {
overflow: hidden;
width: 100%;
height: 100%;
}

/* 主表格tr */
.mainTable tr {
overflow: hidden;
width: 100%;
height: 10%;
}

/* 主表格td */
.mainTD {
overflow: hidden;
width: 11%;
height: 100%;
}

[天际的海浪]

你这个要求不好用表格来做。可以用div内嵌div来做。 一定要用表格就只能js来设置每个tr的高度。

[-一个大坑]

引用 5 楼 天际的海浪 的回复:

你这个要求不好用表格来做。可以用div内嵌div来做。
一定要用表格就只能js来设置每个tr的高度。

还是用table好了，涉及到汇总，用表格方便点
我想把标题行设高点，放在tr还是一样高
.mainTableTR {
overflow: hidden;
width: 100%;
height: 9%;
}

.mainTableTR {
overflow: hidden;
width: 100%;
height: 19%;
}

[老马历写记]

两个方案：
1）如果用table实现的话，tr高度设置百分比很难实现，写死高度px吧，如果要修改高度，通过js动态设置好了；
2）用div，li等替换实现，使用百分比，很容易实现。
仅供参考。

[yanzhi_2016]

1. 想让tr占table高度的百分比生效，给tr加上一个display: block;的属性就可以了。
2. 另外rem是根据html这个节点（也叫根节点）的字体大小来计算的，举个例子，html的font-size是100px；那么1.8rem就是180px。rem一般在移动端用的多一些。

[yanzhi_2016]

tr默认display属性为table-row，手动修改为block后，会引起td的默认样式失效。所以修改tr的display属性为block后，需要重置td的样式。

[-一个大坑]

现在找的电视现场调试宽高，table直接写死的高度

[浪戟天下]

你这个10%是没错的，不过你要给tr加display:block;
这样就可以解决高度问题了。

[浪戟天下]

你这个滚动就需要js来写了