1

我不相信我的问题与本网站上其他人发布的完全一样，所以如果我错过了一个提前向这个优秀社区道歉的问题。

我的问题是这样的：

我已经在导航容器下方设置了一个英雄容器，以使其达到 100%，但是当我减小浏览器的大小时，图像（在英雄容器的背景中）会缩小并且不占用全部尺寸的容器。我不介意图像是否由于它的规模增加和减少而发生变化，我只是不希望它变得太小以至于前景内容没有背景

这是一个屏幕截图，说明了正在发生的事情：http: //youtu.be/lLT3VzHOlPU

这是一个代码笔：http: //codepen.io/MARS/pen/fEuKr

感谢任何花时间提供帮助的人，非常感谢。

4

1 回答 1

1

该视频是描述您的问题的好主意。<div>:) 你可以在with class上使用这个 CSS hero-container。背景图像将始终填满整个空间，但永远不会失真：

-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;

看这里，哪个浏览器支持CSS3 Background-image 选项

演示

先试后买

于 2013-09-08T18:13:49.663 回答