做水平导航怎么用float的问题
用float:left做的水平导航,窗口缩小时,导航选项位置也会移动, 想要固定标签位置?鱼油上传代码,并详细说明需求,会更快获得帮助哦 这是代码,因为用了float:left,所以窗口尺寸变化是,导航的标签也会改变位置
<!DOCTYPE html>
<html>
<head>
<title>水平导航栏</title>
<meta charset="utf-8">
<style type="text/css">
.nav{
width:100%;
background:#5599FF;
text-align:center;
}
ul{
list-style-type:none;
margin:0;
padding:0;
display:inline-block;
}
li{
float:left;
}
a{
height:50px;
width:100px;
display:block;
text-decoration:none;
line-height:50px;
}
</style>
</head>
<body>
<div class="nav">
<ul id="nav_ul">
<li class="homepage"><a href="http://www.baokaodaxue.com/bkdx/index/index" target="_blank">首页</a></li>
<li class="zytb"><a href="#" target="_blank">志愿填报</a></li>
<li class="gktf"><a href="http://www.baokaodaxue.com/bkdx/vip/novip" target="_blank">高考提分</a></li>
<li class="zjydy"><a href="http://www.baokaodaxue.com/bkdx/zx/home" target="_blank">专家一对一</a></li>
<li class="gkq"><a href="#" target="_blank">高考圈</a></li>
<li class="xwzx"><a href="http://www.baokaodaxue.com/bkdx/news/list" target="_blank">新闻资讯</a></li>
<li class="hwzs"><a href="http://www.baokaodaxue.com/bkdx/overseas/search" target="_blank">海外招生</a></li>
</ul>
</div>
</body>
</html>
像鱼C论坛首页的导航栏,是不是用JS实现的,无论窗口尺寸怎么改都不会影响导航栏的位置 以解决,只要把块元素宽度设置为具体的px,而不是百分比,即可
页:
[1]