CSS background属性

• 

  定义和用法

  background属性是以下属性的缩写属性：

  • background-color
  • background-image
  • background-position
  • background-size
  • background-repeat
  • background-origin
  • background-clip
  • background-attachment

  如果缺少上述值之一，则无关紧要，例如background：#ff0000 url(smiley.gif); 被允许。

  特征	说明
  默认值	看单个属性（上述background-*）
  继承	没有
  动画	有。看单个属性（上述background-*）CSS动画参考
  CSS版本	CSS1 + CSS3中的新属性
  JavaScript语法	object.style.background=“red url（smiley.gif）top left no-repeat”尝试一下

• 

  浏览器支持

  表中的数字指定了完全支持该属性的第一个浏览器版本。数字后跟-ms-， -webkit-，-moz-或-o-指定使用前缀的第一个版本。

  属性	Internet Explorer	Chrome	FireFox	Safari	Opera
  属性名称
  background	4.0	1.0	1.0	1.0	3.5

  注意： Internet Explorer 8及更早版本不支持在一个元素上使用多个背景图像。

  注意：请参阅下面每个值的单独浏览器支持。
• 

  CSS语法

  background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;

  注意：如果缩写属性中的某个属性是bg-size属性，则必须使用/（斜杠）将其与bg-position属性分开，例如background：url（smiley.gif）10px 20px/50px 50px; 将产生一个背景图像，位于左侧10个像素，距离顶部20个像素，图像的大小为50像素宽，50像素高。

  注意：如果使用多个背景图像源但又需要背景颜色，则background-color参数需要在列表中位于最后。
• 

  实例

  在一个声明中设置不同的背景属性：

  body { 
   background: lightblue url("img_tree.gif") no-repeat fixed center; 
  }

  尝试一下
• 

  属性值

  属性值	描述
  background-color	指定要使用的背景颜色
  background-image	指定要使用的一个或多个背景图像
  background-position	指定背景图像的位置
  background-size	指定背景图像的大小
  background-repeat	指定如何重复背景图像
  background-origin	指定背景图像的定位区域
  background-clip	指定背景图像的绘画区域
  background-attachment	指定背景图像是固定的还是与页面的其余部分一起滚动
  initial	将此属性设置为其默认值。查看initial关键字
  inherit	从其父元素继承此属性。查看inherit关键字

• 

  相关页面

  HTML教程：HTML样式

  CSS教程：CSS背景

  CSS教程：CSS背景（高级）