CSS 背景background
CSS 中有5個(gè)主要的背景（background）屬性，它們是：
background-color： 指定填滿背景的顏色。
background-image： 引用圖片作為背景。
background-position： 指定元素背景圖片的位置。
background-repeat： 決定是否重複背景圖片。
background-attachment： 決定背景圖是否隨頁(yè)面捲動(dòng)。
這些屬性可以全部合併為一個(gè)縮寫屬性： background。需要注意的一個(gè)要點(diǎn)是背景佔(zhàn)據(jù)元素的所有內(nèi)容區(qū)域，包括 padding 和 border，但不包括元素的 margin。它在 Firefox， Safari ，Opera 以及 IE8 中工作正常，但是 IE6 和 IE7 中，background 沒(méi)把 border 計(jì)算在內(nèi)。
背景色（background-color）
#background-color 屬性用純色來(lái)填滿背景。有許多方式指定這個(gè)顏色，以下方式都得到相同的結(jié)果。
background-color: blue;
background-color: rgb（0， 0， 255）;
background-color： #0000ff;
# background-color 也可被設(shè)定為透明（transparent），這會(huì)使得其下的元素可見(jiàn)。
背景圖（background-image）
#background-image 屬性允許指定一個(gè)圖片展示在背景中?？梢院?background-color 連用，因此如果圖片不重複地話，圖片覆蓋不到地地方都會(huì)被背景色填滿。程式碼很簡(jiǎn)單，只需要記住，路徑是相對(duì)於樣式表的，因此以下的程式碼中，圖片和樣式表是 在同一個(gè)目錄中的。
background-image: url（image.jpg）;
但是如果圖片在一個(gè)名為images 的子目錄中，就應(yīng)該是：
background-image： url（images/image.jpg）;
<html>
<head>
<style type="text/css">
body {background-image: url(這個(gè)地方要寫的就是你的圖片的url地址了);}
</style>
</head>
<body>
</body>
</html>背景平鋪（background-repeat）
設(shè)定背景圖片時(shí)，預(yù)設(shè)把圖片在水平和垂直方向平鋪以鋪滿整個(gè)元素。這也許是你需要的，但是有時(shí)會(huì)希望圖片只出現(xiàn)一次，或只在一個(gè)方向上平鋪。以下為可能的設(shè)定值和結(jié)果：
background-repeat： repeat; /* 預(yù)設(shè)值，在水平和垂直方向平鋪*/
background-repeat： no-repeat; / * 不平鋪。圖片只展示一次。 */
background-repeat： repeat-x; /* 水平方向平鋪（沿x 軸） */
background-repeat： repeat-y; /* 垂直方向平鋪（沿y 軸） */
background-repeat： inherit; /* 繼承父元素的background-repeat 屬性*/
<html>
<head>
<style type="text/css">
body
{
background-image:url(圖片123.jpg);
background-repeat:no-repeat;
}
</style>
</head>
<body>
</body>
</html>##背景的簡(jiǎn)寫屬性
可以把背景的各個(gè)屬性合為一行，而不用每次都單獨(dú)把他們寫出來(lái)。格式如下：background： 《color》 《image》 《position》 《attachment》 《repeat》例如，下面的聲明background-color： transparent;background-image： url（image.jpg）;
background-position： 50% 0 ;
background-attachment： scroll;
#background-repeat： repeat-y;
可以合為單獨(dú)一行：
background： transparent url（image.jpg） 50% 0 scroll repeat-y;
而且不需要指定每一個(gè)值。如果省略值地話，就使用屬性地預(yù)設(shè)值。例如，上面那行和下面這個(gè)效果一樣：
background： url（image.jpg） 50% 0 repeat-y;
<html>
<head>
<style type="text/css">
body
{
background:#ff0000 url(圖片888.jpg) no-repeat fixed center;
}
</syle>
</head>
<body>
<p>各個(gè)屬性間并無(wú)順序</p>
<p>各個(gè)屬性間并無(wú)順序</p>
<p>各個(gè)屬性間并無(wú)順序</p>
<p>各個(gè)屬性間并無(wú)順序</p>
</body>
</html>
