1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > html导航栏中加竖线 前端导航栏标签中间的小竖线 实现方法

html导航栏中加竖线 前端导航栏标签中间的小竖线 实现方法

时间:2024-07-24 09:55:48

相关推荐

html导航栏中加竖线 前端导航栏标签中间的小竖线 实现方法

此方法在可控性方面比较占优势但是会增加一个竖线的节点

html部分:

CSS部分:

.top .top_page .top_page_l ul li{

float: left;

margin-right: 6px;//要计算好距离

}

.top .top_page .top_page_l ul li a{

display: inline-block;

margin-right: 6px;//计算好距离

}

方法二:

HTML:

CSS:

.fenge{

padding:12px 6px 0px 6px;

margin-left: 6px;

border-left: 1px solid #000;

font-size: 0;

}

利用border和padding ,这里使用padding主要是可以调控竖线的高度。实现可控性。优点:可控性高;缺点:多一个空白节点;

方法三(我一般不用 。因为ps不好)

HTML:

CSS:

.reg_img{

background:url(../images/line.gif) no-repeat right;

padding-right:6px;

display:block;

margin-right:6px;

}

利用背景图片;优点:可控性当然就是图片的制作大小;缺点:要切图;

以上。。。。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。