bootstrap怎么设置背景图片自动适应
浏览器:chrome
使用CSS:bootstrap(这个可能会影响到我们css的设置,所以还是提一下)
在设置背景图片的过程中,经常遇到背景图片不能按照自己所想的那样来自动适应屏幕,我也是尝试了很多种方法之后找到了一种适合我自身情况的设置方式。
代码如下:
body { background-image: url("../images/backgroundImg2.jpg"); background-position: center 0; background-repeat: no-repeat; background-attachment: fixed; background-size: cover; -webkit-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -ms-background-size: cover; }
这样,就能成功的设置body的背景图片自动适应屏幕。
但是,其他浏览器能不能兼容我还没去确认过,目前在chrome上面是可以用的。
相关属性:
background-image 属性为元素设置背景图像。
元素的背景占据了元素的全部尺寸,包括内边距和边框,但不包括外边距。
默认地,背景图像位于元素的左上角,并在水平和垂直方向上重复。
提示:请设置一种可用的背景颜色,这样的话,假如背景图像不可用,页面也可获得良好的视觉效果。
相关推荐:《bootstrap教程》
作者:藏色散人
什么是bootstrap框架?Bootstrap是美国Twitter公司的设计师Mark Otto和Jacob Thornton合作基于HTML、CSS、JavaScript 开发的简洁...
一.离线存储 有一个web应用有三个文件index.html,a.js,b.css,现在需要把js和css文件缓存起来 1.在index.html里加上html manifes...
本篇文章给大家介绍一下CSS中的计数函数:counter()、counters()。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所...
css让文字成排显示的方法:1、使用【writing-mode】属性,语法为【writing-mode:lr-tb或writing-mode:tb-rl】;2、对文字对象宽...
jquery字符串转数字的方法:1、使用parseInt()函数解析字符串返回一个整数,语法为“parseInt(字符串)”;2、使用parseFloat()函...