CSS网页布局基础 2-6 编程练习 麻烦老师点评下，为什么头部设了sticky top=0 不能固定，而脚部可以
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{
margin: 0px;
padding: 0px;
}
.par{
width: 1100px;
height: 100px;
margin: 0 auto;
}
.header{
background: black;
border: 1px solid #ccc;
position: sticky;
top：0；
}
.logo{
z-index: -1;
}
.nav{
float: right;
margin-top: -100px;
min-height: 100%;
}
.li{
float: left;
line-height: 90px;
text-align: center;
margin-right: 20px;
color: #FFF;
}
.con img{
width: 100%;
height: 100%;
max-width: 100%;
}
.foot{
width: 100%;
height: 80px;
background: black;
position: sticky;
bottom:0px;
}
.foot-li{
float: left;
line-height: 70px;
text-align: center;
margin-right: 20px;
color: #FFF;
}
.foot-nav{
left: 350px;
position: relative;
}
</style>
</head>
<body>
<div>
<!-- 头部内容 -->
<div>
<div>
<img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png" alt="图片挂了">
</div>
<div>
<div>课程</div>
<div>职业路径</div>
<div>实战</div>
<div>猿问</div>
<div>手机</div>
</div>
</div>
<!-- 中间内容 -->
<div>
<img src="http://climg.mukewang.com/58c0eda50001e12416000480.jpg" alt="">
<img src="http://climg.mukewang.com/58c0edb80001c9f216000480.jpg" alt="">
<img src="http://climg.mukewang.com/58c0edc9000100d516000480.jpg" alt="">
</div>
<!-- 脚部内容 -->
<div>
<div>
<div>企业合作</div>
<div>人才招聘</div>
<div>联系我们</div>
<div>讲师招聘</div>
<div>常见问题</div>
</div>
</div>
</div>
</body>
</html>麻烦老师点评下，为什么头部设了sticky top=0 不能固定，而脚部可以
嘎子012浏览 1109回答 1
1回答
-
慕spring
.header的样式里{ top:0; }用的是中文标点符号，改成英文的就好了
随时随地看视频慕课网APP
Html/CSS