请问，为什么线没有撑到底？好像中部的左中右3块都没有撑到底？为什么呢？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*此处写代码*/
* {
padding:0;
margin:0;
}
body {
font-family:"微软雅黑";
background: #add8e6;
font-size: 12px;
}
.header {
width:100%;
height:80px;
background:black;
color:white;
position: fixed;
}
.logo {
background: url(http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png) no-repeat;
background-size: 240px 80px;
width:300px;
height:80px;
position:absolute;
left:0;
cursor:pointer;
}
.navibar {
position:absolute;
right:0;
}
.navibar li {
list-style:none;
display:inline-block;
line-height:80px;
margin:0 14px;
margin-right:10px;
cursor: pointer;
}
.content{
margin:0 auto;
}
.content_left {
width:35%;
height:500px;
float:left;
line-height: 50px;
padding-top: 130px;
}
.content_middle {
width:35%;
height:500px;
float:left;
line-height: 50px;
padding-top: 130px;
}
.content_right {
width:29%;
height:500px;
float:right;
line-height: 50px;
padding-top: 130px;
border-left: 2px orange solid;
}
.footer{
width:100%;
height:80px;
background:black;
color:white;
text-align:center;
position:fixed;
bottom: 0;
}
.footer li {
list-style:none;
display:inline-block;
margin:0 20px;
line-height:80px;
}
a {
color:white;
text-decoration:none;
cursor:pointer;
}
span {
background:#ff9999;
}
p {
margin-left: 20px;
}
h2 {
margin-left: 20px;
}
input {
line-height:30px;
font-size:10px;
width:220px;
height:25px;
}
#login {
background: red;
border: hidden;
color: white;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="header">
<div class="logo"></div>
<ul class="navibar">
<li><a href="#">课程</a></li>
<li><a href="#">职业路径</a></li>
<li><a href="#">实战</a></li>
<li><a href="#">猿问</a></li>
<li><a href="#">手记</a></li>
</ul>
</div>
<div class="content">
<div class="content_left">
<h2>课程推荐</h2>
<p><span>职业路径</span> HTML与CSS3实现动态网页</p>
<p><span>职业路径</span> 零基础入门Android语法与界面</p>
<p><span>职业路径</span> HTML与CSS3实现动态网页</p>
<p><span>职业路径</span> HTML与CSS3实现动态网页</p>
<p><span>职业路径</span> HTML与CSS3实现动态网页</p>
</div>
<div class="content_middle">
<h2>相关课程</h2>
<p>HTML CSS JavaScript</p>
<p>HTML CSS JavaScript</p>
<p>HTML CSS JavaScript</p>
</div>
<div class="content_right">
<h2>登录</h2>
<p><input type="text" placeholder="请输入登录邮箱/手机号"></p>
<p><input type="password" minlength="6" maxlength="16" placeholder="6-16位密码，区分大小写，不能用空格"></p>
<p><input type="submit" value="登录" id="login"></p>
</div>
</div>
<div class="footer">
<ul>
<li><a href="#">网站首页</a></li>
<li><a href="#">企业合作</a></li>
<li><a href="#">人才招聘</a></li>
<li><a href="#">联系我们</a></li>
<li><a href="#">常见问题</a></li>
<li><a href="#">友情链接</a></li>
</ul>
</div>
</body>
</html>0
收起
正在回答 回答被采纳积分+1
2回答
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星