以下是测试链接:
问题是,我发现当我缩小窗口屏幕时,背景宽度只是窗口的大小,当我滚动它时,其他部分会切断背景。
代码:
<div style="background:url('./assets/image/bg4.jpg'); padding-top:20px;">
<div class="container">
<div class="row">
<div class="col-xs-12">
....
</div>
</div>
</div>
</div>
此外,一个背景已经像这样定制了CSS:
background: url('./image/bg1.jpg') top;
padding: 20px 0px;
background-position: 0px -20px;
background-size: 100% 99%;
非常感谢你的帮助。
答案 0 :(得分:1)
我假设水平滚动不是你想要的东西,因为你包括了Bootstrap库。
在你的style.css中,你覆盖了默认的.container大小,这会破坏页面的响应能力:
.container {
width:960px !important;
}
如果您将其删除,您的网页将会响应一个例外。
您的.top_btn类具有绝对位置。这对于快速响应非常有用,因为它会将这些元素推到身体外面。您可以继续将这些作为位置:绝对,如果您的左侧和顶部属性是百分比。或者将这些图像切换成3个不同的图像并将它们分开链接,而不是将图像绝对定位在一个图像上。