html文字两边是线条,css 两边是线，中间文字的多种实现方法

css 两边是线，中间文字的多种实现方法

历史活动一

---

历史活动二

---

历史活动三

.soild_text_one{

width:500px;

margin:0 auto;

fieldset{

height: 500px;

border-left: none;

border-right: none;

border-bottom: none;

color: #009688;

border-color: #defffc;

height:20px;

legend{

text-align: center;

padding: 0 10px;

font-size: 14px;

}

}

}

.soild_text_two{

text-align:center;

width:500px;

margin:0 auto;

height:20px;

font-size: 14px;

color: #4caf50;

hr{

width:200px;

display:inline-block;

vertical-align:middle;

border-color: #e4ffe6;

}

span{

padding: 0 10px;

}

}

.soild_text_three{

position:relative;

text-align:center;

width:500px;

margin:20px auto;

height:20px;

font-size: 14px;

color:#ff9800;

&::before,&::after{

content:"";

position:absolute;

top:50%;

border:solid 1px #fbdfb6;

width:40%;

}

&::before{

left:0;

}

&::after{

right:0;

}

}

标签：文字,color,text,height,width,两边,border,css,500px

来源： https://blog.csdn.net/jiangyue2694/article/details/110000176