以前做网页布局的时候,一个div只能设置一张背景图片,设置多个背景的话,要用多个div嵌套才能实现,这样兼容性比较好。若您的网站要求兼容浏览器低版本,建议用这种方法。css3的出现,解决了一个div只能设置一个背景的问题,使一个div可以设置多个背景图片。background-image还可以设置线性渐变,等效果。
关于css3的background,功能很强大,有很多属性,像background-size等等,这些属性都可以写一篇博客来讲述。关于css3background的其他属性,后面会出博客来单独讲述!
CSS3/CSS1 background-image 属性
语法:
background-image:[ , ] * = none | | | | |
默认值:none
取值:
none:无背景图。
:使用绝对或相对地址指定背景图像。
立即学习“前端免费学习笔记(深入)”;
:使用线性渐变创建背景图像。(CSS3)
:使用径向(放射性)渐变创建背景图像。(CSS3)
:使用重复的线性渐变创建背景图像。(CSS3)
:使用重复的径向(放射性)渐变创建背景图像。(CSS3)
如果你了解HTML,CSS和JavaScript,您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造,可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序,然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流,并开始构建应用程序,提供更
说明:
设置或检索对象的背景图像。
如果设置了background-image,同时也建议作者设置background-color用于当背景图像不可见时保持与文本一定的对比。
对应的脚本特性为backgroundImage。
CSS中如何设拉伸背景图片铺满屏幕
我写的CSS代码是
#bg
{
width: 100%;
height: 100%;
background:url(images/beijing.png);
}这样子他会重复图片铺满屏幕,我想要让他拉伸图片铺满屏幕,应该怎么写呢?
background:url(images/beijing.png) repeat;
加个属
background-size:100%;background:url(images/beijing.png) no-repeat;
加个属background-size:100%;background:url(images/beijing.png) no-repeat; 图片会失真哦!
要么是外框限制了,都设成100%,我这里试验了下是铺满的,你再看看有没有别的属性影响了的。









