我正在尝试构建一个具有基本 css“视差”效果的网站,其中图像具有 background-attachment:fixed
并在您滚动时停留在那里。代码 background-size:cover
在大型浏览器中运行良好,但我注意到当我将屏幕缩小到 800px 或 900px 时,div 中的图像被截断,我只能看到一点点的图像。我尝试将背景附件更改为 background-attachment:contain
- 当我这样做时,图像在 div 中完美显示,但我看到图像下方有一个巨大的空间。
http://greendental.mediaworksonline.com/
我已经为此绞尽脑汁了 2 天。如果您能提供帮助,我们将不胜感激。我正在构建它以仅使用 css 而不是 jquery。
最佳答案
一个快速的解决方案可以放不同的分辨率,一个例子
@media screen and (max-width: 900px) {
.imgblock {
min-height:400px;
}
}
@media screen and (max-width: 400px) {
.imgblock {
min-height:200px;
}
}
希望对你有帮助
关于html - 响应式 - css 视差类型 - 图像不在容器内,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38855337/