我正在为子菜单项制作 TreeView ,我快完成了。最后一个元素的问题,现在看起来如何:
HTML:
<ul class="menu-items">
<li>
<a href="#">Example 1</a>
</li>
<li>
<a href="#">Tree</a>
<ul class="sub-items">
<li>
<a href="#">Item 1</a>
</li>
<li>
<a href="#">Item2</a>
</li>
</ul>
</li>
<li>
<a href="#">Example 2</a>
</li>
<li>
<a href="#">Example 3</a>
</li>
</ul>
和样式:
.menu-items
li
padding 9px 0
list-style-type none
&.active
a
color $text-color
font-weight 700
.sub-items
padding-left 15px
padding-top 5px
li
position relative
border-left 1px solid #000
li::before
position relative
top -4px
width 15px
border-bottom 1px solid #000
content ''
display inline-block
最好的方法是什么?
最佳答案
尝试添加到你的 CSS 中
li:last-child {
height: 1px;
}
关于html - 树形菜单的 CSS 垂直线,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45732860/