css字型樣式設定
1.字型樣式設定
字型樣式大致有如下幾種特徵:
字型型別(風格)、字型粗細、字型大小、字型系列
(1)字型型別(風格) font-style
用於設定字型風格,可設定以下值:
① normal:普通字型
② italic:斜體
③ oblique:傾斜字型
(2)字型粗細 font-weight
用於設定字型粗細,可設定以下值:
① normal:正常粗細
② bold:粗體
③ bolder:更粗的字型
④ lighter:更細的字型
⑤ 100~900:步長為100,
(3)字型大小 font-size
用於設定字型大小的,可設定任意正整數和浮點數
預設情況下,幾乎所有的瀏覽器的預設字型大小都為16px. 且chrome等主流瀏覽器不支援12畫素以下的字型。
(4)字型系列 font-family
用於設定字型系列,就是我們通常說的「所用字型」。
設定字型有以下規則:
1.使用中文字型,或帶空格的英文本型名,需要用「引號」將該字型名擴起來
2.單個單詞的字型名稱則無需加上引號。
3.「font-family」可以有多個值,多個值設定的作用是,當瀏覽使用者本地計算機沒有找到設定的第乙個值所表示的字型時,會去找第二個,以此類推,若找到最後乙個值都沒有找到匹配的字型,瀏覽器則會用自己的預設字型。
4.考慮到網頁最終顯示效果在不同裝置上的一致性,我們通常使用的中文字型只有:「宋體」、「微軟雅黑」、「黑體」、「楷體」、「幼圓」等,而目前以「微軟雅黑」為最常用設計字型。
5.常用的英文本型有:「arial」、「helvetica」、「tahoma」、「verdana」、「lucida grande」、「times new roman」、「georgia」等。
2.組合值寫法
(1)給上所有的屬性
我們能將「font」的多個值組合起來寫,比如我們要設定乙個
風格為正常,粗體,20畫素大小,「微軟雅黑」
和風格為斜體,正常粗細,字型大小為22畫素,「宋體」
1.所以在寫「font」屬性組合值的時候可以省略二者之一,以辨識到的值進行設定,另外乙個自動為「normal」,
2.甚至還能省略掉第前兩個值,只保留「font-size」和「font-family」
即:style,weight可只給上任意乙個,或者都給,或者都不給,順序也可以換,但是要在前兩個。
注意:
在「font」組合值的寫法中,只有「font-size」和「font-family」這兩個的值是不能省略的,而且是缺一不可,順序也是要先大小後系列不能變,否則瀏覽器會不認識該值,對該組合值進行報錯。
(3)在font內設定文字行高
「font」屬性組合值的寫法,除了以上所提到的,它還有一種比較不常見,卻還比較實用的寫法,即可直接在「font」屬性內設定文字的行高「line-height」
11 27 CSS字型樣式設定
1.字型樣式設定 字型樣式大致有如下幾種特徵 字型型別 風格 字型粗細 字型大小 字型系列 1 字型型別 風格 font style 用於設定字型風格,可設定以下值 normal 普通字型 italic 斜體 oblique 傾斜字型 2 字型粗細 font weight 用於設定字型粗細,可設定以...
03 CSS樣式之字型樣式
屬性 含義font sytle字型風格 font weight字型粗細 font size字型大小 font family字型樣式 font綜合設定 以上1 font style 字型風格 1 normal 正常字型 一般把傾斜字型變為普通字型 2 italic傾斜字型 不常用 舉例快樂最重要 漂亮...
css字型樣式
注 以下的字型樣式只可在ie中使用。刪除線刪除線 加上背景色 加上背景色 左右翻轉效果 左右翻轉效果 上下翻轉效果 上下翻轉效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發光文字效果 發...