老师我想问一下
老师我想问一下那个布局中的“加油”为啥我用两列布局，一个中心显示，而一个没有呢？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>导航条</title>
<style type="text/css">
*{margin:0;padding:0;}
.header{background:black;
font-size:20px;font-family:黑体;color:yellow;
width:100%;height:100px;
position:fixed;
top:0;;left:0;right:0;
/*top:0;right:0;bottom:0;left:0;*/margin:auto;}
.logo{background:url(http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png);
float:left;
width:300px;height:100px;}
.nav ul li{float:right;list-style:none;
line-height:100px;
margin:0 30px;}
.one{width:100%;height:1000px;}
.two{width:60%;height:1000px;
background:blue;
float:left;}
.three{width:40%;height:1000px;
background:red;
float:left;}
.footer{
background: black;color:white;
width:100%;height:100px;
position:fixed;
bottom:0;;left:0;right:0;margin:auto;}
.footer p{list-style:none;text-align: center;
line-height:100px;
margin:0 30px;}
.two ul{margin:50% 50%; color:white;
width:100px;height:40px;
font-size:20px;line-height:40px;
font-family:宋体;
}
.four ul{margin:50% 50%; color:white;
width:100px;height:40px;
font-size:20px;line-height:40px;
font-family:宋体;
}
span{margin:0 60px;}
</style>
</head>
<body>
<div class="header">
<div class="logo"></div>
<div class="nav">
<ul>
<li>课程</li>
<li>职业路径</li>
<li>实战</li>
<li>猿问</li>
<li>手记</li>
</ul>
</div>
</div>
<div class="one">
<div class="two">
<ul>
<li>加油</li>
<li>加油</li>
<li>加油</li>
<li>加油</li>
</ul>
</div>
<div class="three">
<div class="four">
<ul>
<li>加油</li>
<li>加油</li>
<li>加油</li>
<li>加油</li>
</ul>
</div>
</div>
</div>
<div class="footer">
<p><span>课程</span> <span>职业路径</span> <span>实战</span> <span>猿问</span> <span>手记</span></p>
</div>
</body>
</body>
</html>
正在回答
同学你好，可以通过定位去实现：
但是这样修改会影响顶部的显示，这是因为中部内容设置了定位，层级提高了。可以提高顶部的层级：
效果：
如果我的回答帮到了你，欢迎采纳，祝学习愉快~
相似问题
登录后可查看更多问答，登录/注册
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星