一、分割线一： 效果： 代码： 1 ! DOCTYPE html 2 html 3 head 4 meta charset ="utf-8" 5 title / title 6 style 7 div { 8 width : 300px ; 9 height : 20px ; 10 background-color : #FFFFFF ; 11 text-align : center ; 12 position : rela
一、分割线一：
效果：
代码：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style> 7 div{ 8 width:300px; 9 height: 20px; 10 background-color:#FFFFFF; 11 text-align: center; 12 position: relative; 13 } 14 div:after { 15 content: ""; 16 width: 100%; 17 height: 1px; 18 background-color: red; 19 position: absolute; 20 top: 50%; 21 left: 0; 22 } 23 div span { 24 z-index:1; 25 position: relative; 26 background-color:#FFFFFF; 27 padding:0 5px; 28 } 29 </style> 30 </head> 31 <body> 32 <div class="hot"> 33 <span>茶品营销</span> 34 </div> 35 </body> 36 </html>分割线一