實現效果如下：
demo01.png
實現這個效果，我們可能直接使用圖標，可能內嵌一個 span標簽，也可能會使用 ::before 和 ::after 偽元素，不過這其實利用 border就可以實現，上述效果的代碼如下所示：
div {
width: 38px;
height: 6px;
border-top: 18px double #F70776;
border-bottom: 6px solid #F70776;
}
由于 border 的顏色是繼承自 color 的，所以利用以上代碼，我們可以很輕松的實現一個 hover 變色效果，改寫后的代碼如下：
div {
width: 38px;
height: 6px;
border-top: 18px double;
border-bottom: 6px solid;
color: #F70776;
cursor: pointer;
transition: all 1s;
}
div:hover {
color: green;
}
這個技巧是在張鑫旭的教學視屏中看到的，地址如下：CSS 深入理解之 border.
