CSS background 属性

css 背景缩写属性可以在一个声明中设置所有的背景属性

可以设置的属性分别是:

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

如果上述值缺少一个,这不要紧,例如 background:#FF0000 URL(smiley.gif); 是允许的

默认值请参阅单独的属性
继承no
版本CSS1+ CSS3中的新的属性
JavaScript 语法object.style.background="red url(smiley.gif) top left no-repeat"

语法

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

值说明

说明CSS
background-color指定要使用的背景颜色1
background-position指定背景图像的位置1
background-size指定背景图片的大小3
background-repeat指定如何重复背景图像1
background-origin指定背景图像的定位区域3
background-clip指定背景图像的绘画区域3
background-attachment设置背景图像是否固定或者随着页面的其余部分滚动1
background-image指定要使用的一个或多个背景图像1

浏览器支持

所有主要浏览器都支持 background 属性

IE8 和更早版本不支持一个元素多个背景图像

IE7 和更早的版本不支持"继承"的值

IE8 需要定义 <DOCTYPE html>

IE9 支持 "继承"


范例

在一个div元素中设置多个背景图像(并指定他们的位置)

body
{ 
    background: #00ff00 url('smiley.gif') no-repeat fixed center; 
}

本文内容仅供个人学习/研究/参考使用,不构成任何决策建议或专业指导。分享/转载时请标明原文来源,同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦~感谢您的理解与支持!

链接: https://fly63.com/course/6_277

目录选择