li中使用margin-bottom:-1px并不能使最后一个li的下边框被覆盖掉,求解决

来源:5-1 CSS margin负值定位

慕少7532173

2016-10-15 17:57

<ul id="test">  
        <li>Test</li>  
        <li>Test</li>  
        <li>Test</li>  
        <li>Test</li>  
        <li>Test</li>  
    </ul>
body,ul,li{margin:0;padding:0;}  
   ul,li{list-style:none;}  
   #test{  
       margin:20px;  
       width:390px;  
       background:#F4F8FC;  
       border-radius:3px;  
       border:6px solid red;  
   }  
/*每一个li的高度是35px*/  
   #test li{  
       height:25px;  
       line-height:25px;  
       padding:5px;  
       border-bottom:3px dotted black;  
margin-bottom:-3px;  
   }

http://img.mukewang.com/5801fd690001586f04660230.jpg

写回答 关注

1回答

  • grace_0008
    2016-10-17 10:33:51
    已采纳

    #test{  

           margin:20px;  

           width:390px;  

           background:#F4F8FC;  

           border-radius:30px;  

           border:6px solid red; overflow:hidden; 

       } 

    加个overflow:hidden; 样式就可解决问题,使最后一个li的下边框隐藏


    慕少7532...

    可以解决~谢谢回答~

    2016-10-17 10:48:50

    共 1 条回复 >

CSS深入理解之margin

本CSS教程带你深入讲解CSS的margin属性,解决你多年困惑

55943 学习 · 66 问题

查看课程

相似问题