展开全部
上下两行导航的时候定义css 才能上下对齐,首先我们需要给这个上下2个导航条设置一样的宽度和高度,然后在给导航条中的每个li设置一样的宽度和高度,和margin值,就能保持上下对齐了,通过代码来理解:
<html>
<head>
<style> //通过style实现
#nav{
width:900px;
height:30px;
}
#nav ul li{
float:left;
width:60px; //当宽度不够的时候自然就会往下走,然后也是对齐第一个排列的
}
</style>
<link rel='stylesheet' type='text/css' href='./css/index1.css'> //通过外部文件实现
</head>
<body>
<div class="nav" style="width:400px"> //通过行内实现
<ul>
<li>
<a href="">首页</a>
</li>
<li>
<a href="">兴趣爱好</a>
</li>
<li>
<a href="index.php">好友印象</a>
</li>
<li>
<a href="register.php">会员注册</a>
</li>
<li>
<a href="dengtu.php">会员登录</a>
</li>
</ul>
</div>
</body>
</html>
展开全部
给li定义一 个宽度,还有给左浮动float:left
追问
浮动,宽度都有 主要是上边的汉子导航 之间有“ | ” 下边的菜单是英文的,长短不一 ,要求英文还要剧中
菜单菜单 | 菜单菜单 | 菜单菜单
one VIEWPOINT VIEWPOINT
追答
你给ul都给一个 clear:left 来清除浮动,就会一个在上,一个在下。至于“|”你可以用border或者用图像background来实现,居中就用text-align:center
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<style type="text/css">
ul li { margin:0; padding:0; list-style:none;}
.nav ul li { float: left; padding-right:15px; }
.nav span { text-align:center;}
</style>
</head>
<body>
<div class="nav">
<UL>
<li>菜单<br/><span>one</span></li>
<li>菜单<br/><span>two</span></li>
<li>菜单<br/><span>three</span></li>
<li>菜单<br/><span>four</span></li>
<li>菜单<br/><span>five</span></li>
<li>菜单<br/><span>six</span></li>
</UL>
</div>
ul li { margin:0; padding:0; list-style:none;}
.nav ul li { float: left; padding-right:15px; }
.nav span { text-align:center;}
</style>
</head>
<body>
<div class="nav">
<UL>
<li>菜单<br/><span>one</span></li>
<li>菜单<br/><span>two</span></li>
<li>菜单<br/><span>three</span></li>
<li>菜单<br/><span>four</span></li>
<li>菜单<br/><span>five</span></li>
<li>菜单<br/><span>six</span></li>
</UL>
</div>
追问
菜单|
菜单|
菜单|
VIEWPOINT
INDEX
CONTACT
这样总是上下对不齐 差一点。。
追答
按我写的不就对齐了吗?把中文和英文写在同一个li里面就可以了。用span分开,用把span强制转行。这样代码最简洁
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<div>
<ul>
<li></li><li></li><li></li><li></li>
</ul>
<ul>
<li></li><li></li><li></li><li></li>
</ul>
严格定义#div .ul div .ul .li的大小
<ul>
<li></li><li></li><li></li><li></li>
</ul>
<ul>
<li></li><li></li><li></li><li></li>
</ul>
严格定义#div .ul div .ul .li的大小
追问
我知道这么写 主要是 下面的英文长短不一即使我给li 定义了宽度 也还是上下对不齐啊
追答
我的意思是.ul .li的宽度统一定义,也就是等宽,这样上下不就对齐了吗
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询