显示属性 - 表格、行、单元格 - 如何在现在显示为行的每个 LI 的底部添加边框



我有一个无序列表,我将其显示为表格,因此我可以在每个li标签之前插入一个自定义的windgbat。此列表也不缩进,而是与正常段落的左侧齐平。

现在每个 li 都

显示为表格行,如何在每个 li 的底部添加边框?

我尝试以各种方式将以下内容添加到下面的代码中,但它不会显示边框。

底部边框:1px 实心 #25a186;

.post-body ul{
list-style-type: none;
margin-left: 0px;
padding-left: 0em;
text-indext: -1em;
display: table;
}
.post-body li{
display: table-row;
}
.post-body ul li::before{
content:"261e";
color: #8d8d8d;
text-align: right;
padding-right: .6em;
display: table-cell;
}

我终于找到了一个解决方案:

它使用 boxshadow 来模拟边框并忽略第一个 li。

前两种样式适用于可能不支持 CSS3 的浏览器,对于现代浏览器可能不是必需的。

.post-body ul li + li{
-moz-box-shadow: 0 -1px 0 #8d8d8d;
-webkit-box-shadow: 0 -1px 0 #8d8d8d;
box-shadow: 0 -1px 0 #8d8d8d;
}

最新更新