CSS 背景

CSS背景属性:

    background:简写属性,作用是将背景属性设置在一个声明中。

          如:  body{background:#ff0000 url(/i/1.gif) no-repeat fixed center;}

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

          如:  body{

                  background-image:url(/i/1.gif);

                  background-attachment:fixed;

                 }

        background-attachment属性值:

            scroll:默认值。背景图像会随着页面其余部分的滚动而移动。

            fixed:当页面的其余部分滚动时,背景图像不会移动。

            inherit:规定应该从父元素继承background-attachment属性的设置。

    background-color:设置元素的背景图像。

          如:  body{  background-color:yellow;     }

              h1{   background-color:#00ff00;    }

              p{     background-color:rgb(255,0,255);   }

        baground-color属性可能的值:

            color-name:规定颜色值为颜色名称的背景颜色(比如:yellow);

            hex-number:规定颜色值为十六进制值的背景颜色(比如:#00ff00);

            rgb-number:规定颜色值为rgb代码值的背景颜色(比如:rgb(255,0,255));

            transparent:默认值。背景颜色为透明色。

            inherit:规定应该从父类元素继承background-color属性的值。

    background-image:把图片设置为背景。

          如:  body{  background-image:url(/i/1.gif) ;  }

        background-image属性可能的值:

            url('url'):指向图片的路径。(如:url(/i/1.gif));

            none:默认值。不设置背景图片。

            inherit:规定应该从父元素继承background-image属性的设置。

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

          如:  body{  background-position:center;  }

        background-position属性可能的值:

            top  left      

            center  center

            bottom   right  

           //第一列代表垂直方向的对齐方式,第二列代表水平方向的对齐方式。 

            x%    y%

            xpx    ypx  

           //第一列代表距离左边距的值,第二列代表距离页面顶部的值。

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

          如:  body{   background-repeat:repert-y;  } 

        background-repeat属性可能的值:

            repeat:默认。背景图像将在垂直和水平方向重复。

            repeat-x:背景图像将在水平方向重复。

            repeat-y:背景图像将在垂直方向重复。

            no-repeat:背景图像将仅仅显示一次。

            inherit:规定应该从父元素继承background-repeat属性的设置。 

           

               

原文地址:https://www.cnblogs.com/lanchong/p/1781920.html