樣式大致如下：

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的方式來(lái)實(shí)現(xiàn)：

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

總結(jié)

以上是生活随笔為你收集整理的CSS实现三道杠的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。