老师，为什么我的底部导航的ul没有高度呢，而且设置了居中没有效果
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | <!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积分~
来为老师/同学的回答评分吧