html中页面背景属性,css背景属性有哪些？

css背景属性有哪些？下面本篇文章给大家带来关于css背景属性的介绍，有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。

css背景属性有哪些？background简写属性，作用是将背景属性设置在一个声明中。

background-attachment背景图像是否固定或者随着页面的其余部分滚动。

background-color设置元素的背景颜色。

background-image把图像设置为背景。

background-position设置背景图像的起始位置。

background-repeat设置背景图像是否及如何重复。

background-size规定背景图片的尺寸。

background-clip规定背景的绘制区域。

background-origin规定背景图片的定位区域。

下面来简单介绍一下这些背景属性。

background属性：

background 简写属性在一个声明中设置所有的背景属性。

可以设置如下属性：background-color

background-position

background-size

background-repeat

background-origin

background-clip

background-attachment

background-image

如果不设置其中的某个值，也不会出问题，比如 background:#ff0000 url('smiley.gif'); 也是允许的。

通常建议使用这个属性，而不是分别使用单个属性，因为这个属性在较老的浏览器中能够得到更好的支持，而且需要键入的字母也更少。

background-color属性：颜色名称，如：background-color:red;

十六进制背景色，如：background-color:#ff0000; / background-color:#f00;

rgb颜色，这里如果是rgba，a表示透明程度，为0全透明，为1全显示，如：background-color:rgb(255,0,0); / background-color:rgba(0,0,255,0.8);

transparent，透明，如：background-color:transparent;

background-image属性：url图片地址，可以多个图片，如：background-image: url(img/a.jpg),url(img/b.jpg);

none，不显示背景图像

background-repeat属性：repeat：水平和垂直方向都重复图像，如：background-repeat: repeat;

repeat-x：水平方向重复图像

repeat-y：垂直方向重复图像

no-repeat：图像不重复

background-position属性：位置名字组合定位，只写一个默认另一个为居中，如：background-position: right bottom; / background-position: center;

百分比位置，如：background-position: 20% 20%;

具体像素位置， 如：background-position: 20px 20px;

background-attachment属性：scroll：背景图像相对于页面不动，会随着网页的滚动而移动，默认

fixed：背景图像相对于浏览器窗口不动，内容滚动的时候背景图像不动，如：background-attachment: fixed;

background-size属性：像素大小，只写一个默认另一个为auto，如：background-size: 200px 100px;

百分比大小，如：background-size: 60% 60%;

cover：背景图像覆盖当前元素的所有背景区域，如：background-size: cover;

contain：图像显示最大且刚好完全显示，一般不能覆盖全部背景区

background-clip属性：border-box：背景覆盖到边框区域，如：background-clip: border-box;

padding-box：背景覆盖到padding区域

content-box：背景只覆盖到content部分

background-origin属性：border-box：背景图像的起始位置在边框处，如：background-origin: border-box;

padding-box：背景图像的起始位置从padding处开始

content-box：背景图像的起始位置从content处开始

更多web开发知识，请查阅 HTML中文网 ！！