导航条上标签之间的竖线是如何做的？html
展开全部
可以使用一个空的<div>来充当竖线。
比如
<div class="line"></div>
css中：
.line{
height: 导航条的高度(或者你觉得合适的高度);
width: 1px;
background: #000;
}
比如
<div class="line"></div>
css中：
.line{
height: 导航条的高度(或者你觉得合适的高度);
width: 1px;
background: #000;
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
*{ padding:0px; margin:0px;}
ul,li{ list-style:none;}
.sub_nav{ height: 35px; text-align: center;top: 0; width: 100%; display: block; z-index: 100;}
.sub_nav_con { width:780px; height:35px; overflow:hidden; float:left; display:block;}
.sub_nav_con li{ float:left; background:url(../images/bg_nav_li.jpg) top right no-repeat; line-height:35px; font-size:14px;font-family:Microsoft YaHei; display:block; padding:0px 12px 0px 10px;}
.sub_nav_con li a{ color:#fff; font-size:14px; color:#333333; text-decoration:none;}
</style>
</head>
<body>
<div class="sub_nav">
<ul class="sub_nav_con l">
<li><a href="#" target="_blank" title="天翼军事首页">天翼军事首页</a></li>
<li><a href="#" target="_blank" title="军事新闻">军事新闻</a></li>
<li><a href="#" target="_blank" title="军事历史">军事历史</a></li>
</ul>
</div>
</body>
</html>
---------------------------------------
CSS样式里的LI背景图片就是竖线图片，你自己改一下。
<html>
<head>
<meta charset="utf-8">
<style>
*{ padding:0px; margin:0px;}
ul,li{ list-style:none;}
.sub_nav{ height: 35px; text-align: center;top: 0; width: 100%; display: block; z-index: 100;}
.sub_nav_con { width:780px; height:35px; overflow:hidden; float:left; display:block;}
.sub_nav_con li{ float:left; background:url(../images/bg_nav_li.jpg) top right no-repeat; line-height:35px; font-size:14px;font-family:Microsoft YaHei; display:block; padding:0px 12px 0px 10px;}
.sub_nav_con li a{ color:#fff; font-size:14px; color:#333333; text-decoration:none;}
</style>
</head>
<body>
<div class="sub_nav">
<ul class="sub_nav_con l">
<li><a href="#" target="_blank" title="天翼军事首页">天翼军事首页</a></li>
<li><a href="#" target="_blank" title="军事新闻">军事新闻</a></li>
<li><a href="#" target="_blank" title="军事历史">军事历史</a></li>
</ul>
</div>
</body>
</html>
---------------------------------------
CSS样式里的LI背景图片就是竖线图片，你自己改一下。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
可以用背景图来实现，也可以在文字中间加入|，不过还是建议用背景图，这样比较灵活，而且与设计可以完美兼容
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你可以用DIV+CSS控制 可以做出PL的分隔符
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（6）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
