老师,为什么我的底部导航的ul没有高度呢,而且设置了居中没有效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{margin: 0;
padding: 0;}
.container{padding-top: 100px;}
.container img{display: block;width: 100%;}
.nav{width: 100%;height: 100px;background-color: black;position: fixed;}
.nav img{display: block;float: left;margin-left: 5%;}
ul{list-style-type: none;line-height: 100px;font-size: 22px;font-family: "微软雅黑";}
.nav ul{float: right;margin-right:5%; }
li{float: left;margin:0 30px;}
a{color: white;}
.foot{width: 100%;height: 100px;background-color: black;}
.foot ul{margin: 0 auto;}
</style>
</head>
<body>
<div class="nav">
<a href="#"><img src="http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png"/></a>
<ul>
<a href="#"><li>课程</li></a>
<a href="#"><li>职业路径</li></a>
<a href="#"><li>实战</li></a>
<a href="#"><li>猿问</li></a>
<a href="#"><li>手记</li></a>
</ul>
</div>
<div class="container">
<img src="http://img1.sycdn.imooc.com/climg//58c0eda50001e12416000480.jpg"/>
<img src="http://img1.sycdn.imooc.com/climg//58c0edb80001c9f216000480.jpg" />
<img src="http://img1.sycdn.imooc.com/climg//58c0edc9000100d516000480.jpg"/>
</div>
<div class="foot">
<ul>
<a href="#"><li>网址首页</li></a>
<a href="#"><li>企业合作</li></a>
<a href="#"><li>人才招聘</li></a>
<a href="#"><li>联系我们</li></a>
<a href="#"><li>常见问题</li></a>
<a href="#"><li>友情链接</li></a>
</ul>
</div>
</body>
</html>1
收起
正在回答
1回答
同学你好,关于同学的疑问解答如下:
1、ul没有居中是因为没有给ul设置宽度,建议参考如下:

2、不是很理解同学说的底部导航没有高度是什么意思,建议详细描述一下
3、css中如下设置属于全局设置,也就是说,nav里面的ul li a和foot里面的ul li a都能继承里面的样式

4、标签嵌套错误,ul和li是组合标签,及ul里面嵌套的是li标签,li标签里面嵌套a标签才是正确的,参考如下:


如果我的回答帮助了你,望采纳,祝学习愉快!
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星