如果你是做網(wǎng)站的，肯定對(duì)URL （或者在CSS2.1中稱為URI）很熟悉。如果需要引用一個(gè)URL （如@import語(yǔ)句中，導(dǎo)入外部樣式表時(shí)就會(huì)使用這條語(yǔ)句），一般格式則為：

url(protocol://server/pathname)

這個(gè)例子定義了一個(gè)所謂的絕對(duì)URL (absolute URL)。這里的絕對(duì)是指，不論這個(gè)URL 放在哪里（或者放在哪個(gè)頁(yè)面上），它都能正常工作，因?yàn)樗x了網(wǎng)站空間中的一個(gè)絕對(duì)位置。假設(shè)你有一個(gè)名為www.waffle.org的網(wǎng)站服務(wù)器。該服務(wù)器上有一個(gè)名為pix 的目錄，在這個(gè)目錄中有一個(gè)圖像waffle22.gif。這種情況下，該圖像的絕對(duì)URL將是：

/UploadFiles/2018-09-06/2018964941301724.gif

不管這個(gè)URL放在哪里，它都是合法的，而不論包含這個(gè)URL的頁(yè)面在服務(wù)器m.iy5y368.cn 上還是在web.pancakes.com 上。

另一種URL是相對(duì)URL (relative URL)，之所以得名是因?yàn)樗付ǖ氖且粋€(gè)相對(duì)于該URL所在文檔的位置。如果指向一個(gè)相對(duì)位置，如Web頁(yè)面所在目錄中的一個(gè)文件，則一般格式為：

url(pathname)

如果圖像與包含該URL的頁(yè)面在同一個(gè)服務(wù)器上，這就能正常工作。為了說(shuō)明這一點(diǎn)，假設(shè)有一個(gè)位于/index.asp的頁(yè)面，而且希望這個(gè)貝面上出現(xiàn)圖像waffle22.gif。在這種情況下，URL將是：

pix/waffle22.gif

這個(gè)路徑是合法的，因?yàn)閃eb瀏覽器知道它要從Web文檔所在位置開(kāi)始，然后加上這個(gè)相對(duì)URL來(lái)找到圖像。在這里，路徑名pix/waffle22.gif要增加到服務(wù)器名http://m.iy5y368.cn，得到了/pix/waffle22.gif。使用相對(duì)URL 的地方幾乎總能用一個(gè)絕對(duì)URL取而代之，使用哪一種URL并不重要，只要它能定義一個(gè)合法的位置。

在CSS中，相對(duì)URL要相對(duì)于樣式表本身，而不是相對(duì)于使用該樣式表的HTML文檔。例如，可能有一個(gè)外部樣式表，其中導(dǎo)入了另一個(gè)樣式表。如果使用相對(duì)URL來(lái)導(dǎo)入第二個(gè)樣式表，它必須相對(duì)于第一個(gè)樣式表。舉例來(lái)說(shuō)，來(lái)考慮一個(gè)位于waffles.org/toppings/tips.html 的 HTML 文檔，它包含一個(gè)指向樣式表waffles.org/styles/basic.css 的鏈接：

<link rel="stylesheet" type="text/css"

href="/styles/basic.css">

在文件basic.css中有一個(gè)@import:語(yǔ)句指向另一個(gè)樣式表：

@import url(special/toppings.css}；

這個(gè)@import會(huì)導(dǎo)致瀏覽器查找位于http://www.waffles.org/styles/special/toppings.css的樣式表，而不是在/toppings/special/toppings.css 查找樣式表。如果在后面這個(gè)位置上有一個(gè)樣式表，那么basic.css中的@import應(yīng)當(dāng)讀作：

@import url{/toppings/special/toppings.css};

警告：Netscape Navigator 4會(huì)相對(duì)于HTML文檔而不是相對(duì)于樣式表解釋相對(duì)URL。如果有很多NN4.X用戶訪問(wèn)你的網(wǎng)頁(yè)，或者如果你想確保NN4.X能找到你的所有樣式表和背景圖像，通常最容易的做法是讓所有URL都是絕對(duì)URL，因?yàn)镹avigator可以正確地處理絕對(duì)URL。

注意，url和開(kāi)始括號(hào)之間不能有空格：

body {background: url(http://www.pix.web/picturel.jpg);}/* correct */

body {background: url (images/picture2.jpg);}　　/* INCORRECT */

如果存在空格，整個(gè)聲明都將無(wú)效，以至于被忽略。

關(guān)鍵字

有時(shí)一個(gè)值需要用某個(gè)詞來(lái)描述，這種詞就稱為關(guān)鍵字。對(duì)此一個(gè)很常見(jiàn)的例子就是關(guān)鍵字none，它不同于0（零）。因此，要去除一個(gè)HTML文檔中鏈接的下劃線，應(yīng)寫(xiě)作：

a:link, a:visited {text-decoration: none;}

類(lèi)似地，如果想對(duì)鏈接加下劃線，則要使用關(guān)鍵字underline。

如果一個(gè)屬性接受關(guān)鍵字，那么其關(guān)鍵字將只針對(duì)該屬性的作用域定義。如果兩個(gè)屬性都使用同一個(gè)詞作為關(guān)鍵字，一個(gè)屬性的關(guān)鍵字與另一個(gè)屬性的同一關(guān)鍵字可能就有不同的行為。舉例來(lái)說(shuō)，為letter-spacing定義的normal與為font-style定義的normal含義就大不相同。

inherit

CSS2.1中有一個(gè)關(guān)鍵字是所有屬性共有的，這就是inherit。inherit使一個(gè)屬性的值與其父元素的值相同。在大多數(shù)情況下，不必指定繼承，因?yàn)榇蠖鄶?shù)屬性本身會(huì)自然地繼承，不過(guò)，inherit還是很有用的。

例如，考慮以下樣式和標(biāo)記：

#toolbar {background: blue; color: white;}

<div id="toolbar">

<a href="one.html">One</a>|<a href="two.html">Two</a>|<a href ="three.html">Three</a>

</div>

div本身將有一個(gè)藍(lán)色背景和一個(gè)白色前景色，但是鏈接還是會(huì)根據(jù)瀏覽器的首選頂設(shè)置來(lái)應(yīng)用樣式。最后往往會(huì)是藍(lán)色背景上的藍(lán)色文本，之間有白色的豎線將其分隔。

可以編寫(xiě)一個(gè)規(guī)則，明確地將“工具條”中的鏈接設(shè)置為白色，不過(guò)通過(guò)使用inherit 可以更健壯地做到這一點(diǎn)。只需向樣式表增加以下規(guī)則：

#toolbar a {color: inherit;}

這會(huì)讓鏈接使用繼承的color值而不是用戶代理的默認(rèn)樣式。正常情況下，直接指定的樣式總會(huì)優(yōu)先于繼承的樣式，但是通過(guò)使用inherit可以把情況反過(guò)來(lái)。

CSS2單位

除了已經(jīng)介紹的CSS2.1中的單位，CSS2還包含另外幾個(gè)單位，所有這些單位都與聲音樣式表有關(guān)（支持語(yǔ)音的瀏覽器會(huì)使用這種樣式表）。這些單位并沒(méi)有包含在CSS2.1中，但是由于它們可能是CSS將來(lái)版本的一部分，在此做一個(gè)簡(jiǎn)單的討論。

角度值

用于定義給定的聲音從哪個(gè)位置發(fā)出。共有3種角度：度（deg）、梯度（grad）和弧度（rad）。例如，直角可以聲明為90deg、100grad或1.57rad；不論如何聲明，這些值都會(huì)解釋為0~360度范圍內(nèi)的度數(shù)。負(fù)數(shù)值也是如此（允許是負(fù)數(shù)），-90deg 等同于270deg。

時(shí)間值

用于指定語(yǔ)音元素之間的延遲?？梢员硎緸楹撩耄╩s），也可以表示為秒（s）。因此，100ms和0. 1s是相同的。時(shí)間值不能是負(fù)值，因?yàn)镃SS的設(shè)計(jì)要求避免這種不可能的情況。

頻率值

用于為語(yǔ)音瀏覽器可以產(chǎn)生的聲音聲明一個(gè)給定頻率。頻率值可以表示為赫茲（Hz）或兆赫（MHz），而且不能是負(fù)值。值后面跟的標(biāo)簽（Hz或MHz）不區(qū)分大小寫(xiě)，因此10MHz和1OMhz是一樣的。

在寫(xiě)這本書(shū)時(shí)，已經(jīng)知道的支持所有這些值的唯一一個(gè)用戶代理是Emacspeak，這是一個(gè)聲音樣式表實(shí)現(xiàn)。有關(guān)聲音樣式的更多詳細(xì)信息見(jiàn)第14章。

除了這些值以外，還有一個(gè)“老朋友”，不過(guò)它有了一個(gè)新名字，這就是URI (Uniform Resource Identifier，統(tǒng)一資源標(biāo)識(shí)符），這是統(tǒng)一資源定位符（Uniform Resource Locator, URL）的另一個(gè)名字。CSS2和CSS2.1規(guī)范都要求URI要以u(píng)rl (...)形式聲明，因此實(shí)際上沒(méi)有什么改變。

小結(jié)

單位和值的覆蓋面很廣，從長(zhǎng)度單位到描述效果（如underline）的特殊關(guān)鍵字，再到顏色單位，還包括文件（如圖像）的位置。大多數(shù)情況下，在單位方面，用戶代理幾乎能做到完全正確，不過(guò)也存在少量bug和奇怪問(wèn)題會(huì)來(lái)煩你。例如，Navigator 4.x不能正確地解釋相對(duì)URL，這被許多創(chuàng)作人員過(guò)分夸大，以至于過(guò)分地依賴于絕對(duì)URL。用戶代理在顏色領(lǐng)域也幾乎完全勝任，但同樣不乏一些小問(wèn)題。不過(guò)，由于存在太多不同的長(zhǎng)度單位，盡管這絕對(duì)不是bug，但實(shí)際上這才是所有創(chuàng)作人員需要解決的一個(gè)有意思的問(wèn)題。

這些單位都各有優(yōu)缺點(diǎn)，這取決于它們?cè)谑裁辞闆r下使用。我們已經(jīng)了解了這樣的一些環(huán)境，本書(shū)余下的內(nèi)容將重點(diǎn)討論這些場(chǎng)合，首先從CSS屬性開(kāi)始，CSS屬性描述了如何改變文本的顯示方式。