列表边框消除重叠的问题?
<ul>
<li> A </li>
<li> B </li>
<li> C </li>
</ul>
Css:
ul{margin:0 0;}
ul li{border:1px solid red;list-style:none;}
====================================
以上的Css设置是把每个li标签加的红色的边框,顶端和底端都没问题,但是中间的li边框上边和第一个li边框的下边重叠,中间的li边框的下边和第3个li 边框上边重叠,其实就是两个li边框重叠了,明显变粗,不知道Css 中有没有消除重叠的方法?
------解决方案--------------------ul{
border:#f00 solid;
border-width:1px 1px 0;
}
ul li{
border-bottom:1px #f00 solid;
}
這樣可以嗎?
------解决方案--------------------ul{margin:0 0;}
ul li{
border-top:1px solid red;
border-right:1px solid red;
border-left:1px solidred;
border-bottom:0px solid red;
list-style:none;}
ul .bottom{
border-top:1px solid red;
border-right:1px solid red;
border-left:1px solid red;
border-bottom:1px solid red;
list-style:none;}
<ul>
<li> A </li>
<li> B </li>
<li class= "bottom "> C </li>
</ul>