其實(shí)這個(gè)在功能在項(xiàng)目中還是經(jīng)常會(huì)需要到的跟磨，除了使用背景圖片來實(shí)現(xiàn)外杆怕，我們還可以借助css偽類before,after來實(shí)現(xiàn)族购。
效果圖
HTML代碼
<span>這是中間的文字</span>
CSS代碼
span {
display: block; /*設(shè)置為塊級(jí)元素會(huì)獨(dú)占一行形成上下居中的效果*/
font-size: 3em;
color: #212121;
position: relative; /*定位橫線（當(dāng)橫線的父元素）*/
}
span:before, span:after {
content: ''; /*CSS偽類用法*/
position: absolute; /*定位背景橫線的位置*/
top: 52%;
background: #494949; /*寬和高做出來的背景橫線*/
width: 9%;
height: 2px;
}
span:before{
left: 25%; /*調(diào)整背景橫線的左右距離*/
}
span:after {
right: 25%;
}
