html 文字两边加横线\竖线

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/a772116804/article/details/78506327

第一种:

//横线

<style>

 .exple {  
   height: 50px;  
   line-height: 60px;  
   text-align: center;  
}  
 .order .line {  
   display: inline-block;  
   width: 250px;  // 横线长度
   border-top: 1px solid  #ccc ;  
   margin-bottom:5px;   位置//横线移动
   margin-left:10px;

   height: 1px;  //横线厚度
   background:red;   //颜色

}  
.exple .txt {  
   color: #686868;  
   vertical-align: middle;  
} 
</style>
<div class="exple">  
<span class="line"></span>  
<span class="txt">文字在中间</span>  
<span class="line"></span>  
</div>
//竖线

<div class="line"></div>
css中:
.line{
    display:inline-block;
    height: 导航条的高度(或者你觉得合适的高度);
    width: 1px;
    background: #000;
}

阅读更多
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页