樣式大致如下：

html代碼如下：

<i class="icon-menu"></i>

css如下：

.icon-menu {display: inline-block;width: 140px; height: 10px;padding: 35px 0;border-top: 10px solid;border-bottom: 10px solid;background-color: currentColor;background-clip: content-box; }

還可以使用border-style: double的方式來實現(xiàn)：

<div class="border"></div> .border {width: 120px;height: 120px;border-top: 60px double;border-bottom: 20px solid; }

總結

以上是生活随笔為你收集整理的CSS实现三道杠的全部內容，希望文章能夠幫你解決所遇到的問題。

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