当我调整浏览器大小时使用引导程序,背景中的图片会缩小,而背景颜色不会缩小。
以下是包含 HTML 代码的网站链接:http://code Differently.com/crest.html http://codedifferently.com/crest.html
这是我使用的 CSS 代码:
@charset "UTF-8";
/* CSS Document */
/* Move down content because we have a fixed navbar that is 50px tall */
body {
padding-top: 0px;
padding-bottom: 20px;
}
div.jumbotron {
background-image: url('img/chicago2.jpg');
background-color: #3FF;
background-size: 100%;
height: 500px;
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
}
div.navbar navbar-default navbar-static-top" role="navigation {
border: 0px;
}
如果我理解正确的话,不确定,因为background-color
do NOT缩小,但我认为你的意思是你的图像应该调整大小并且颜色应该NOT看起来就像现在处于全视图中一样。所以如果理解正确的话。
改变这个:
background-size: 100%;
to
background-size: cover;
并添加浏览器的供应商以使其跨浏览器:
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
查看有关的更多信息背景大小 https://developer.mozilla.org/en-US/docs/Web/CSS/background-size
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)