我需要在表格中实现行选择,但是当我将 border: 1px;
设置为整行时,它设置在左侧的表格内,但在右侧是 1px
外面。
现在有人知道怎么把它放在 table 里面吗?
谢谢!
table {
margin: 10px;
border-collapse: collapse;
}
tr {
background: lime;
}
tr:first-child + tr {
border:1px solid red;
}
td {
padding: 2px 5px;
}
<table>
<tr><td>item1</td><td>item2</td></tr>
<tr><td>item3</td><td>item4</td></tr>
<tr><td>item5</td><td>item6</td></tr>
</table>
最佳答案
使用 box-shadow
和 inset
table {
margin: 10px;
border-collapse: collapse;
}
tr {
background: lime;
}
tr:first-child + tr {
box-shadow: 0 0 0 2px red inset;
}
td {
padding: 2px 5px;
}
<table>
<tr><td>item1</td><td>item2</td></tr>
<tr><td>item3</td><td>item4</td></tr>
<tr><td>item5</td><td>item6</td></tr>
</table>
关于html - <tr> 边框增加 1px,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54328020/