CSS 背景

一.背景色

可以使用 background-color 属性为元素设置背景色。这个属性接受任何合法的颜色值。

这条规则把元素的背景设置为红色：

p {background-color: red}

 如果希望背景色从元素中的文本向外少有延伸，只需增加一些内边距：

p {background-color: red;  padding: 20px}

 二.背景图像

 

要把图像放入背景，需要使用 background-image 属性。background-image 属性的默认值是 none，表示背景上没有放置任何图像。

如果需要设置一个背景图像，必须为这个属性设置一个 URL 值：

body {background-image: url(/image/liang.gif);}

 三.背景重复

 

如果需要在页面上对背景图像进行平铺，可以使用 background-repeat 属性。

属性值 repeat 导致图像在水平垂直方向上都平铺，就像以往背景图像的通常做法一样。

repeat-x 和 repeat-y 分别导致图像只在水平或垂直方向上重复，no-repeat 则不允许图像在任何方向上平铺。

默认地，背景图像将从一个元素的左上角开始。

 

1.水平重复

body
  { 
  background-image: url(/image/liang.gif);
  background-repeat: repeat-x;
  }

 2.垂直重复

body   
  {    
  background-image: url(/image/liang.gif);   
  background-repeat: repeat-y;   
  }  

3.任何方向都不重复

body      
  {       
  background-image: url(/image/liang.gif);      
  background-repeat: no-repeat;      
  }