如何让页脚的字在页面居中显示？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*此处写代码*/
*{margin:0;padding:0;}
h3{padding:150px 0 30px 200px;}
li{list-style-type:none;}
span{background:pink;}
.nav{width:100%;height:;background:black;}
.nav ul{float:right;}
.nav ul li{color:white;float:left;line-height:100px;margin-right:50px;}
.container{width:100%;height:800px;background:skyblue;}
.container .left{width:50%;height:800px;float:left;}
.container .left ul li{padding-left:200px;}
.container .right{width:50%;height:800px;float:right;}
.container .right ul li{padding-left:200px;}
.footer{width:100%;height:100px;background:black;}
.footer ul{width:80%;margin:0 auto;}
.footer li{color:white;float:left;line-height:100px;margin-right:50px;}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="nav"><img src="http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png">
<ul>
<li>课程</li>
<li>职业路径</li>
<li>实战</li>
<li>提问</li>
<li>手记</li>
</ul></div>
<div class="container">
<div class="left">
<h3>课程推荐</h3>
<ul>
<li><span>111</span> 11111</li>
<li><span>111</span> 11111</li>
<li><span>111</span> 11111</li>
<li><span>111</span> 11111</li>
</ul>
</div>
<div class="right">
<h3>课程推荐</h3>
<ul>
<li><span>111</span> 11111</li>
<li><span>111</span> 11111</li>
<li><span>111</span> 11111</li>
<li><span>111</span> 11111</li>
</ul>
</div>
</div>
<div class="footer">
<ul>
<li>网站首页</li>
<li>职业路径</li>
<li>合作伙伴</li>
<li>友情提示</li>
<li>关注我们</li>
</ul>
</div>
</body>
</html>
正在回答
同学你好，对于你的问题解答如下：
使页脚列表居中显示的方法: 将ul列表的宽度改为固定宽度，并为li设置padding，调整列表间距。使列表居中显示。
ul列表宽度的计算方法：一个li的宽度为64,一行有五个li，乘以5，就是320px,每个li所设置的左边距和右边距分别为50px,总共有十个边距，所以要乘以10，即为500px。即ul列表的宽度：320px+500px=820px.
参考如下：
代码中存在的其他问题如下：
1、.nav设置高度时缺少高度值。建议补充高度值为100px，参考如下：
2、如下代码可以进行样式合并，优化代码。参考如下：
如果我的回答帮助了你，欢迎采纳。祝学习愉快~
相似问题
登录后可查看更多问答，登录/注册
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星