當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

css解决li边框重合问题

發布時間：2023/12/3 编程问答 30 豆豆

生活随笔收集整理的這篇文章主要介紹了 css解决li边框重合问题小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

我直接寫了個案例，先看下效果圖：

下面是html代碼：

<!DOCTYPE html> <html><head><meta charset="utf-8" /><title>機構動態</title><style type="text/css">*{margin:0px;padding:0px; }.test_m ul {margin: 20px;width: 630px;overflow:hidden;border-top:1px solid black;}.test_m ul li{padding: 10px 20px 11px 20px;box-sizing: border-box;float: left;width: 315px;height: 111px;list-style: none;}.test_m ul li:nth-child(2n+1){border:1px solid black;border-top:0;}.test_m ul li:nth-child(2n){border-bottom:1px solid black;border-right:1px solid black;}</style></head><body><div class="test_m"><ul><li>菜單1</li><li>菜單2</li><li>菜單3</li><li>菜單4</li></ul></div></body> </html>

總結

以上是生活随笔為你收集整理的css解决li边框重合问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇：提货是什么意思提货的解释
下一篇： mybatis+spring报错Prop