CSS 背景
CSS 属性定义背景效果:
- background-color
- background-image
- background-repeat
- background-attachment
- background-position
十六进制 - 如:"#ff0000"
RGB - 如:"rgb(255,0,0)"
颜色名称 - 如:"red"
图像放置关键字最容易理解的作用就像其名字的意义。例如,top left 使图像放置在元素内边距区的左上角。
只要保证不超过两个关键字:一个对应水平方向,另一个对应垂直方向,那么你可以设置位置关键字以任何顺序出现。
如果只有一个关键字,则会默认另一个关键字为 center。background-position:right top;
百分数值的表现方式更为复杂。假设你希望用百分数值将图像在其元素中居中,你可以按照下面的代码进行设置:
background-position:50% 50%;
长度值
长度值解释的是元素内边距区左上角的偏移,偏移点是图像的左上角。
比如,如果设置值为 50px 100px,图像的左上角将在元素内边距区左上角向右 50 像素、向下 100 像素的位置上:
background-position:50px 100px;
(偏移只是从一个左上角到另一个左上角。也就是说,图像的左上角与 background-position 声明中的指定的点对齐。)
背景- 简写属性
在以上实例中我们可以看到页面的背景颜色通过了很多的属性来控制。
为了简化这些属性的代码,我们可以将这些属性合并在同一个属性中.
背景颜色的简写属性为 "background":
body {background:#ffffff url('img_tree.png') no-repeat right top;}