风吹钰成花丶

不积小流无以成江海。

html 文字两边加横线\竖线

第一种:

//横线

<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;
}

阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/a772116804/article/details/78506327
个人分类: html+css+js Css3
想对作者说点什么? 我来说一句

CSS 画竖线

xingxing513234072 xingxing513234072

2013-11-04 16:22:20

阅读数:7651

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

不良信息举报

html 文字两边加横线\竖线

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭