我有一个表格,我正在使用 CSS 来显示底部边框。
.inset {
border-bottom: 1px solid #dadce0;
}
我希望左右两侧有一些空间,就像使用 <hr align="center" width="80%">
一样但我根本不觉得这是可能的。
是否有任何我应该查看的属性或我应该研究的 CSS 技巧以保持表格完好无损并能够看到居中但仅占表格宽度 80% 的底部边框?
最佳答案
您可以将表格宽度设置为 80%(左右边距各留 10%),然后使整个表格居中:
.inset {
border-bottom: 1px solid #dadce0;
width: 80%;
margin: 0 auto;
background-color: coral;
}
.inset td {
text-align: center;
}
<table class="inset">
<tr>
<td>Row 1 - Cell 1</td>
<td>Row 1 - Cell 2</td>
<td>Row 1 - Cell 3</td>
</tr>
<tr>
<td>Row 2 - Cell 1</td>
<td>Row 2 - Cell 2</td>
<td>Row 2 - Cell 3</td>
</tr>
<tr>
<td>Row 3 - Cell 1</td>
<td>Row 3 - Cell 2</td>
<td>Row 3 - Cell 3</td>
</tr>
</table>
关于html - 表格边框底部的间距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53290697/