(9)CSS背景控制

2021-06-21 16:35:23 字數 1031 閱讀 5129

前面已經提到,css將每個元素視為在單獨的框中進行處理,那麼我們可以通過一些屬性改變元素對應的框的背景,以改善網頁樣式。

(1)background-color:為任何元素指定單一背景顏色

該屬性的值可以為顏色名、16進製制編碼或者rgb值。

(2)background-image:將任一元素的背景設定為一副影象

該屬性的值以url開頭,並在其後位於圓括號和引號中寫入影象的url。例如:

background-image : url("images/background.gif")

在同時設定了color和image的情況下,image優先被採用。建議color的設定與image的主色調相近,因為在image載入時,網頁暫時顯示背景顏色設定。

(3)background-repeat

當制定了background-image屬性,且框的範圍比影象大時,可能需要多次重複影象以填充整個框。取值如下:

(4)background-position:用於固定背景影象的位置,取值如下:

(5)background-attachment:常用於水印

當指定背景影象時,可以使用該屬性將影象固定在該位置上還是隨著滾動網頁而移動。

(6)background:指定背景屬性的簡寫形式

該屬性的值可以以以上五種屬性的值的任意順序給出,如果不提供任何值,則使用預設值。

background: red url("hah.gif") fixed  no-repeat  center

9 CSS樣式引入

標籤上使用style屬性直接引入css樣式,即內聯樣式。style color red font size 24px 這是乙個段落p body 在頭部標籤內通過設定css樣式,即內部樣式。charset utf 8 網頁標題title pstyle head 這是一段文字p body html 新建...

html css js入門 9 CSS樣式

css 樣式 css 單位 尺寸 百分比 in 英吋 cm 厘公尺 mm 公釐 pt 磅 1pt等於1 72英吋 px 畫素 計算機螢幕上的乙個點 em 1em等於當前的字型尺寸,2em等於當前字型尺寸的兩倍 css 單位 顏色 rgb x,x,x rgb值,如 rgb 255,0,0 rgb x ...

前端網頁學習9(css盒子)

border 邊框 padding 內邊距 margin 外邊距 content 內容 盒子的長寬實際與內容的長寬相同。三大屬性 邊框顏色,邊框線型,邊框粗細 四個邊可分開設定。邊框定義可以簡寫,且三大屬性無順序要求。四個邊可分開設定。可共同設定意義如下 padding 10px 四個內邊距都是10...