我有一个背景图像div放在另一个div里,而不是适合宽度父div,它适合全屏幕。请看看我的代码清楚地知道,对不起英文不好。Div与背景图像里面div不能正常工作
http://codepen.io/thehung1724/full/jEEgQq/
HTML
<div id="video-section" class="dark-section">
<div class="home"></div>
<div class="fullscreen-img" style="background-image: url(http://upanh.biz/images/2014/11/23/bg1.jpg)"></div>
</div>
CSS
*{
margin: 0;
padding: 0;
}
#video-section{
margin: 0 auto;
width: 1230px;
height: 500px;
}
.dark-section{
background-color: black;
}
.home{
display: table;
height: 500px;
left: 0;
position: relative;
top: 0;
width: 100%;
}
.fullscreen-img {
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
height: auto;
left: 0;
min-height: 500px;
position: fixed;
top: 0;
width: 100%;
z-index: -1;
}
预先感谢。
你的意思是为什么'.fullscreen-img' div适合全屏幕? :) – Shomz 2014-11-23 15:59:50
是的,我该如何解决它? :) – 2014-11-23 16:08:30
它是全屏幕的原因是因为位置:固定。这使得它的div定位和尺寸是相对于视口而不是它的父亲来计算的。你要做什么? – peterjb 2014-11-23 16:13:29