使用 CSS 來精確定義頁面的外觀,相信大家都不會陌生,但面對眾多的CSS屬性,對于初學者難免有些害怕,雖然有很多功能強大的網(wǎng)頁制作軟件可以讓你不用鍵盤就可以定義CSS屬性,但了解源代碼還是必不可少的!從這一次開始,將系統(tǒng)地介紹 CSS 的各個屬性,因為對頁面產(chǎn)生影響的最終手段還是使用屬性。因此,熟練地掌握 CSS 的每一個屬性及各個屬性值是十分必要的。
字體屬性
每個人在瀏覽頁面時,對頁面的第一印象可能就是文檔所使用的字體和頁面上的各種顏色?梢赃@樣說,一個頁面字體使用得好壞可以直接關(guān)系到頁面的瀏覽質(zhì)量。因此,在 CSS 中有關(guān)字體的屬性都具有非常強大的功能。在定義時務(wù)必使用一些能夠被 UA 識別的字體,下面我們就來看看有關(guān)字體的一些屬性。
font-family 屬性值:[[<family-name> | <generic-family>],] * [<family-name> | <generic-family>] 初始值:由 UA 默認的值制定 適用于:所有元素 繼承:是 百分比值:不適用 這個屬性是一個按照優(yōu)先順序列出的字體名稱,它的表述方法與大多數(shù)的 CSS 屬性有些不同,它的值是用逗號分隔的,用來指定可替換的字體。 BODY{font-family:gill,helvetica,sans-serif} 上面這行代碼執(zhí)行時,如果瀏覽器沒有尋找到“gill”字體,那么就使用“helvetica”或者用“sans-serif”字體替代。
font-style 屬性值:normal | italic | oblique 初始值:normal 適用于:所有元素 繼承:是 百分比:不適用 “font-style”屬性選擇了字體中的普通或斜體字形。在 UA 的字體數(shù)據(jù)庫中被標記“oblique”的字體,有時并不是天生的斜體,而是被系統(tǒng)自動變斜的普通字形。
font-variant 屬性值:normal | small-caps 初始值:normal 適用于:所有元素 繼承:是 百分比值:不適用 “font-variant” 屬性決定了字符是以普通還是以小體大寫(small-caps)顯示。所謂小體大寫,就是字體中的所有小寫字母看上去與大寫字母一樣,只不過尺寸比標準的大寫要小一點。如果指定的小體大寫不存在,那么就用普通字體,并且用大寫字母代替其中所有的小寫字母。 <HTML> <head> <title>CSS Demo</title> <style type="text/css"> H3{font-variant:small-caps} EM{font-style:oblique} </style> </head> <body> <h1>This is <em>Slanted</em> headline 1 </h1> <h2>This is <em>Slanted</em> headline 1 </h2> <h3>This is <em>Slanted</em> headline 1 </h3> </body> </HTML>
font-weight 屬性值:normal | bold | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 初始值:normal 適用于:所有元素 繼承:是 百分比值:不適用 “font-weight” 定義了字體的粗細值。這些值從“100”排到“900”,每一個數(shù)字所表示的字體都要比它前一個粗一些。在這些值當中,“normal”相當于“400”,“bold”相當于“700”。至于其它關(guān)鍵字都是相對于上級元素的粗細來繼承的。
font-size 屬性值:<absolute-size> | <relative-size> | <length> | <percentage> 初始值:medium 適用于:所有元素 繼承:是 百分比值:參照上級元素的字體尺寸 <absolute-size>關(guān)鍵字指的是字體尺寸的絕對值,該值由 UA 決定。 [xx-small | x-small | small | medium | large | x-large | xx-large] <relative-size> 此關(guān)鍵字指的是相對于上級元素字體尺寸的大小值。 <larger | smaller] 其它均可指定一個數(shù)字字號。
|