[英]Div table-row Border?
我试图在我的网站上使用div创建一个类似于表格的结构,但是边界有一些困难。 我希望有一条水平线分隔每一行,但使用div设置为table-row
border
似乎没有效果。 我究竟做错了什么? 谢谢你的帮助!
<div class="table">
<div class="row">
<div class="cell">
<p>Blah blah</p>
</div>
<div class="cell">
<p>Blah blah</p>
</div>
<div class="cell">
<p>Blah blah</p>
</div>
</div>
</div>
.table {
display: table;
width: 100%;
}
.row {
display: table-row;
border-bottom: 1px solid black;
}
.cell {
display: table-cell;
width: 33%;
}
您还可以添加border-collapse: collapse
到.table
,如果你想设置border
在.row
。
您可以将border-bottom
属性应用于单元类而不是行类。
这是一个固定的演示: http : //jsfiddle.net/WXCa6/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.