【正妹跨丟鬼】

背景設定(background)body{

background :色碼; /*背景底色*/

background-image : url('背景圖片網址'); /*背景圖片網址*/

background-repeat : repeat; 　 /*背景圖片重複排列*/

background-attachment: fixed; /*背景圖片固定*/



} 　





　



[解說]

　



1. body{background:色碼;}設定的是背景圖未出現之前的背景色(背景底色)，也可以不設定背景圖而僅設定背景色。



若背景欲透明，語法則改為background: none或不要加。



　



2. 背景圖片網址應為http://.....開頭，大部分為jpg或bmp或gif圖檔。



如果背景圖片突然自動消失表示該圖片置放的網路空間壞掉了，建議把你的背景圖片上傳置放在無名相簿空間當中，比較穩定



(但無名圖片不可外連，即使用無名圖片當連結只可以用在無名的網頁裡)。

　



3.利用無名圖片當背景的方法:點擊該圖片(點至最大張尺寸)，在圖片上面按滑鼠右鍵，選內容，複製新開啟視窗之網址貼於語法裡面即可。



網址格式如下:

http://pic32.pic.wretch.cc/photos/1/p/ppkeigo/38/1120130848.jpg (正確網址)

http://www.wretch.cc/album/show.php?i=ppkeigo&b=38&f=1120130848&p=71 (錯誤網址)



<圖解說明>利用無名圖片當背景



　



4. background-repeat:no-repeat /*背景不重覆*/

background-repeat:repeat-x /*背景在X軸方向重覆*/

background-repeat:repeat-y /*背景在Y軸方向重覆*/

background-position : right /*背景位置靠右*/

background-position : left /*背景圖靠左*/

background-position : center /*背景圖置中*/

(註1) 背景本身要夠大張(請用繪圖軟體自行設計)，才可使背景完整填滿整個頁面，不然就要用repeat語法去填充整個頁面。



(註2) 利用繪圖軟體設計背景時建議圖片大小為1024X600(畫素)，相簿框的大小為120X120(畫素)。(螢幕解析度為1024X768時適用)

　



5. background-attachment: fixed表示固定背景效果(浮水印效果)，背景不會隨捲軸移動而移動，拿掉這個語法背景就會隨捲軸移動。

　



6. 可自行設定背景圖片的位置:如我現在要把背景設定在畫面的右下角(數字可自行設定)，

則語法為background-position:90% 90% /*設定背景圖片於平面座標位置*/



(設計技巧)如果你的背景圖片想要自己調整位置時，先調整長(height)寬(width)至一定長寬度，然後用這個語法去設定。



7.表格裡面也常利用加入背景的語法來美化版面。



如在留言板的留言格裡面可加入背景語法為.side{background-image: url("背景網址");}。



所以你可以在任意的地方加入你想要的背景圖片，僅需改變HTML標籤即可(大括號裡面樣式屬性的用法都是一樣的)。



　



[範例]



BODY {

background:#009900;

background-image: url(http://pic32.pic.wretch.cc/photos/1/p/ppkeigo/15/o1133712483.jpg);

background-repeat:repeat ;

background-attachment: fixed;

}