如何使用div+css 实现简单的导航栏
2个回答
展开全部
<html>
<head></head>
<body>
<style type="text/css">
li{list-style-type:none;
}
a{text-decoration:none;
}
.lanmu{
width:980px;
height:120px;
border:1px #993399 solid;
margin:0 auto;
}
.lanmu ul {
width:900px;
height:60px;
margin:0 auto;
border:1px #9900CC solid;
margin-top:30px;}
.lanmu ul li {
width:210px;
height:30px;
float:left;
margin-top:10px;
border:1px solid;
text-align:center;
padding-top:10px}
</style>
<div class="lanmu">
<ul>
<li><a href="#">栏目1</a></li>
<li><a href="#">栏目2</a></li>
<li><a href="#">栏目3</a></li>
<li><a href="#">栏目4</a></li>
</ul>
</div>
</body>
</html>
结合css就可以了
#换成你想要的链接 ，再把边框线去掉就可以了
<head></head>
<body>
<style type="text/css">
li{list-style-type:none;
}
a{text-decoration:none;
}
.lanmu{
width:980px;
height:120px;
border:1px #993399 solid;
margin:0 auto;
}
.lanmu ul {
width:900px;
height:60px;
margin:0 auto;
border:1px #9900CC solid;
margin-top:30px;}
.lanmu ul li {
width:210px;
height:30px;
float:left;
margin-top:10px;
border:1px solid;
text-align:center;
padding-top:10px}
</style>
<div class="lanmu">
<ul>
<li><a href="#">栏目1</a></li>
<li><a href="#">栏目2</a></li>
<li><a href="#">栏目3</a></li>
<li><a href="#">栏目4</a></li>
</ul>
</div>
</body>
</html>
结合css就可以了
#换成你想要的链接 ，再把边框线去掉就可以了
本回答由网友推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<html>
<head></head>
<body>
冯佳敏
<div>
<ol>
<a href="www.baidu.com"><li>列表项1</li></a>
<a href="www.baidu.com"><li>列表项2</li></a>
<a href="www.baidu.com"><li>列表项n</li></a>
</ol>
</div>
</body>
</html>
<head></head>
<body>
冯佳敏
<div>
<ol>
<a href="www.baidu.com"><li>列表项1</li></a>
<a href="www.baidu.com"><li>列表项2</li></a>
<a href="www.baidu.com"><li>列表项n</li></a>
</ol>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
|
广告 您可能关注的内容 |
