css背景：
背景色
可以使用 background-color 属性为元素设置背景色。这个属性接受任何合法的颜色值。
p {background-color: gray; padding: 20px;}//padding 内边框属性
背景图像
要把图像放入背景，需要使用 background-image 属性。
| 设定情况 | 例子 |
|---|---|
| background-image 属性的默认值是 none | 表示背景上没有放置任何图像 |
| body元素设定背景图像 | body {background-image: url(/i/eg_bg_04.gif);} |
| 段落设定背景 | p.flower {background-image: url(/i/eg_bg_03.gif);} |
| 行内元素设置背景 | a.radio {background-image: url(/i/eg_bg_07.gif);} |
背景定位
可以使用background-position 属性改变图像在背景中的位置.
body
{
background-image:url('/i/eg_bg_03.gif');
background-repeat:no-repeat;
background-position:center;
}
- 关键字
| 单一关键字 | 等价关键字 |
|---|---|
| center | center center |
| top | top center 或 center top |
| bottom | bottom center 或 center bottom |
| right | right center 或 center right |
| left | left center 或 center left |
- 百分数值
将图像在其元素中居中：
background-position: 50% 50%;
将一个图像放在水平2/3处，垂直1/3处：
background-position: 66% 33%;
- 长度值
元素内边框距左上角的距离，如果要向水平偏移50xp，垂直偏移100xp，可以如下设定：
background-position:50px 100px;
背景关联
可以使用background-attachment属性来设定：
| 属性值 | 效果 |
|---|---|
| scroll | 默认值，背景会随文档滚动 |
| fixed | 声明背景相对于可视区是固定的 |
背景重复
可以使用background-repeat属性来设定背景平铺效果：
| 属性值 | 效果 |
|---|---|
| repeat | 图像在水平垂直方向上都平铺 |
| repeat-x | 图像只在水平方向上重复 |
| repeat-y | 图像只在垂直方向上重复 |
| no-repeat | 不允许图像在任何方向上平铺 |
