我需要一个带滚动条的 tbody 而 thead 不应该有滚动条。因此,在这样做时,thead 的宽度会减小到 thead 中文本的大小。
有没有办法让广告的宽度大小与主体的宽度大小相同
这是我的。 https://jsfiddle.net/Viraj173/jqwgkq8k/
CSS
tbody.scroll{
overflow-y: auto;
height:100px;
position: absolute;
}
th {
color: #ffffff;
background: #373d49;
padding: 5px;
text-align: left;
font-size: 14px;
}
HTML
<table >
<thead>
<tr>
<th>
Value
</th>
</tr>
</thead>
<tbody class="scroll">
<tr>
<td>
Setting Value 1
</td>
</tr>
<tr>
<td>
Setting Value 1
</td>
</tr>
<tr>
<td>
Setting Value 1
</td>
</tr>
<tr>
<td>
Setting Value 1
</td>
</tr>
<tr>
<td>
Setting Value 1
</td>
</tr>
<tr>
<td>
Setting Value 1
</td>
</tr>
<tr>
<td>
Setting Value 1
</td>
</tr>
<tr>
<td>
Setting Value 1
</td>
</tr>
<tr>
<td>
Setting Value 1
</td>
</tr>
</tbody>
</table>
最佳答案
使用这个:
th {
color: #ffffff;
background: #373d49;
padding: 5px;
padding-right:100px;
text-align: center;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
font-size: 14px;
}
关于css - thead 的宽度不同于 tbody,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41825841/