如何使用 CSS 使背景填充整个 div

Question

如何以全高扩展背景图像？http://codepen.io/aalis/pen/egmmeW

.navbar-default { font-family: 'Montserrat', serif; background: #ccddff; border-bottom-color: #DFDFDF; height: 50px; margin-bottom: 0; }
.navbar-header .navbar-brand {
  font-size: 36px; color: #b37700;
}
/*--HOME--*/
#home {
  background: url('http://s17.postimg.org/m4bfqfgn3/fog_1005445_1920.jpg') no-repeat center center fixed;
}

Answer 1

查看代码笔

您必须在 CSS 中使用 background-size 属性。

要使图像完全覆盖您的div，您可以使用

 background-size:100% 100%;

请在文档中阅读有关它的更多信息。

Answer 2

如果你想要全高，你可以在你的css中使用：

img { height:100% }

如果你想要全屏图像，你可以使用：

img { height:100%; width:auto; }

Answer 3

使用这个：

background: url("your image url") no-repeat center center fixed; 
background-size: cover;  
-webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;