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