9 CSS字型例項的多種變換

2022-06-21 23:51:11 字數 1163 閱讀 8218

字型有以下幾種常用屬性:

字型大小(字高)

font-size:大小

行高line-height:大小

字型粗細

font-weight:大小

字型樣式

font-style:樣式

字型屬性整合

font:style weight size/line-height family

(1) 字型

font-family:「字型名稱」

font-family:「字型1」,「字型2」,「字型3」,…,「字型n」; 支援設定多個字型,使用的優先順序從前到後,前面的用不了就用後面的

(2) 字型大小

(字型大小也稱為字高,即字的高度,而字寬是根據字型本身的比例進行縮放)

font-size:大小

(3) 行高

line-height:大小

(4) 字型粗細

font-weight:大小

① font-weight:100~900 9個級別,每一級都是整百數值

② font-weight:normal 標準粗細(系統預設粗細),normal = 400數值的粗細

③ font-weight:bold 粗,bold = 700數值的粗細

④ font-weight:bolder 更粗

⑤ font-weight:lighter 更細

(5) 字型樣式

font-style:樣式

① font-style:normal 標準樣式(系統預設樣式)

② font-style:italic 斜體

③ font-style:oblique 傾斜

(6) 字型屬性整合

font:style weight size/line-height family

font:size family 簡寫最少必須有字型大小和字型

(9)CSS背景控制

前面已經提到,css將每個元素視為在單獨的框中進行處理,那麼我們可以通過一些屬性改變元素對應的框的背景,以改善網頁樣式。1 background color 為任何元素指定單一背景顏色 該屬性的值可以為顏色名 16進製制編碼或者rgb值。2 background image 將任一元素的背景設定為一...

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 ...