position:fixed究竟是会不会脱离文档流？
CSS
.header {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 3;
background-color: #f7f7f7;
}
.screen-1 {
position: relative;
overflow: hidden; /* 溢出隐藏 */
height: 800px;
background: url("../img/screen-1-bg.png") center center no-repeat;
background-size: cover;
}
HTML
<header class="header"></header>
<div class="screen-1"></div>
为什么header不会脱离文档流？
11
收起
正在回答
1回答
同学你好，关于同学的问题回答如下：
1、固定定位会脱离文档流。
2、同学应该给header区域设置一个高度，否则没有内容，它的高度就为0：
参考：
然后我们就可以发现，图片被头部覆盖了一部分，这是因为头部设置了固定定位，脱离了文档流：
如果我的回答帮助了你，欢迎采纳。祝学习愉快~
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧