CSS網(wǎng)頁(yè)背景屬性課件

CSS網(wǎng)頁(yè)背景屬性

設(shè)置背景圖片背景圖片顯示設(shè)置背景圖片平鋪設(shè)置背景顏色312334354設(shè)置背景圖片的位置設(shè)置背景顏色3CSS網(wǎng)頁(yè)背景屬性1background-color屬性：用于設(shè)定網(wǎng)頁(yè)的背景色?；镜恼Z(yǔ)法格式為：默認(rèn)值，表示透明設(shè)置背景顏色background-color屬性不僅以設(shè)置整個(gè)網(wǎng)頁(yè)的背景顏色，同樣還可以設(shè)置指定HTML元素的背景色。設(shè)置背景顏色4CSS網(wǎng)頁(yè)背景屬性1設(shè)置背景顏色5CSS網(wǎng)頁(yè)背景屬性1標(biāo)題區(qū)域背景色為紅色。段落區(qū)域背景色為灰色。分別為字體設(shè)置了不同的前景色。設(shè)置背景圖片6CSS網(wǎng)頁(yè)背景屬性1background-image屬性：設(shè)置背景圖片。基本的語(yǔ)法格式如下：圖片路徑可以是絕對(duì)路徑，也可以是相對(duì)路徑。設(shè)置背景圖片7CSS網(wǎng)頁(yè)背景屬性1網(wǎng)頁(yè)中顯示了背景圖，但如果背景圖大小小于整個(gè)網(wǎng)頁(yè)的大小，此時(shí)圖片為了填充網(wǎng)頁(yè)背景色，會(huì)重復(fù)出現(xiàn)，并鋪滿(mǎn)整個(gè)網(wǎng)頁(yè)。設(shè)置背景圖片平鋪8CSS網(wǎng)頁(yè)背景屬性1background-repeat屬性：用來(lái)設(shè)置圖片的重復(fù)方式，包括水平重復(fù),垂直重復(fù)和不重復(fù)等。設(shè)置背景圖片平鋪9CSS網(wǎng)頁(yè)背景屬性1網(wǎng)頁(yè)中顯示了背景圖，但圖片以默認(rèn)大小顯示，而且沒(méi)有對(duì)整個(gè)網(wǎng)頁(yè)背景進(jìn)行填充。這是因?yàn)榇a中設(shè)置了背景圖不重復(fù)平鋪。設(shè)置背景圖片平鋪10CSS網(wǎng)頁(yè)背景屬性1網(wǎng)頁(yè)中顯示了背景圖，圖片在水平方向平鋪。背景圖片顯示11CSS網(wǎng)頁(yè)背景屬性1background-attachment屬性：用來(lái)設(shè)定背景圖片是否隨文檔一起滾動(dòng)。它包含兩個(gè)屬性值：scroll和

fixed,并適用于所有元素。背景圖片顯示12CSS網(wǎng)頁(yè)背景屬性1設(shè)計(jì)一個(gè)基礎(chǔ)頁(yè)面，一個(gè)標(biāo)題和三個(gè)段落。背景圖片顯示13CSS網(wǎng)頁(yè)背景屬性1該屬性的值為fixed時(shí)，背景圖片的位置固定，并不是相對(duì)于頁(yè)面的，而是相對(duì)于頁(yè)面的可視范圍。設(shè)置背景圖片的位置14CSS網(wǎng)頁(yè)背景屬性1background-position屬性：用于指定背景圖片在頁(yè)面中所處的位置。絕對(duì)定義位置百分比定義位置垂直對(duì)齊水平對(duì)齊設(shè)置背景圖片的位置15CSS網(wǎng)頁(yè)背景屬性1網(wǎng)頁(yè)中顯示了背景，其背景是從頂部和右邊開(kāi)始的。設(shè)置背景圖片的位置16CSS網(wǎng)頁(yè)背景屬性1網(wǎng)中顯示了背景，其背景是從左上角開(kāi)始的，但并不是從(0,0)坐標(biāo)位置開(kāi)始，而是從(20,30)坐標(biāo)位置開(kāi)始。