如果你是做網站的，肯定對URL （或者在CSS2.1中稱為URI）很熟悉。如果需要引用一個URL （如@import語句中，導入外部樣式表時就會使用這條語句），一般格式則為：

url(protocol://server/pathname)

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

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

不管這個URL放在哪里，它都是合法的，而不論包含這個URL的頁面在服務器www.ccaudelo.com 上還是在web.pancakes.com 上。

另一種URL是相對URL (relative URL)，之所以得名是因為它指定的是一個相對于該URL所在文檔的位置。如果指向一個相對位置，如Web頁面所在目錄中的一個文件，則一般格式為：

url(pathname)

如果圖像與包含該URL的頁面在同一個服務器上，這就能正常工作。為了說明這一點，假設有一個位于/index.asp的頁面，而且希望這個貝面上出現圖像waffle22.gif。在這種情況下，URL將是：

pix/waffle22.gif

這個路徑是合法的，因為Web瀏覽器知道它要從Web文檔所在位置開始，然后加上這個相對URL來找到圖像。在這里，路徑名pix/waffle22.gif要增加到服務器名http://www.ccaudelo.com，得到了/pix/waffle22.gif。使用相對URL 的地方幾乎總能用一個絕對URL取而代之，使用哪一種URL并不重要，只要它能定義一個合法的位置。

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

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

href="/styles/basic.css">

在文件basic.css中有一個@import:語句指向另一個樣式表：

@import url(special/toppings.css}；

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

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

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

注意，url和開始括號之間不能有空格：

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

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

如果存在空格，整個聲明都將無效，以至于被忽略。

關鍵字

有時一個值需要用某個詞來描述，這種詞就稱為關鍵字。對此一個很常見的例子就是關鍵字none，它不同于0（零）。因此，要去除一個HTML文檔中鏈接的下劃線，應寫作：

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

類似地，如果想對鏈接加下劃線，則要使用關鍵字underline。

如果一個屬性接受關鍵字，那么其關鍵字將只針對該屬性的作用域定義。如果兩個屬性都使用同一個詞作為關鍵字，一個屬性的關鍵字與另一個屬性的同一關鍵字可能就有不同的行為。舉例來說，為letter-spacing定義的normal與為font-style定義的normal含義就大不相同。

inherit

CSS2.1中有一個關鍵字是所有屬性共有的，這就是inherit。inherit使一個屬性的值與其父元素的值相同。在大多數情況下，不必指定繼承，因為大多數屬性本身會自然地繼承，不過，inherit還是很有用的。

例如，考慮以下樣式和標記：

#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本身將有一個藍色背景和一個白色前景色，但是鏈接還是會根據瀏覽器的首選頂設置來應用樣式。最后往往會是藍色背景上的藍色文本，之間有白色的豎線將其分隔。

可以編寫一個規則，明確地將“工具條”中的鏈接設置為白色，不過通過使用inherit 可以更健壯地做到這一點。只需向樣式表增加以下規則：

#toolbar a {color: inherit;}

這會讓鏈接使用繼承的color值而不是用戶代理的默認樣式。正常情況下，直接指定的樣式總會優先于繼承的樣式，但是通過使用inherit可以把情況反過來。

CSS2單位

除了已經介紹的CSS2.1中的單位，CSS2還包含另外幾個單位，所有這些單位都與聲音樣式表有關（支持語音的瀏覽器會使用這種樣式表）。這些單位并沒有包含在CSS2.1中，但是由于它們可能是CSS將來版本的一部分，在此做一個簡單的討論。

角度值

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

時間值

用于指定語音元素之間的延遲?？梢员硎緸楹撩耄╩s），也可以表示為秒（s）。因此，100ms和0. 1s是相同的。時間值不能是負值，因為CSS的設計要求避免這種不可能的情況。

頻率值

用于為語音瀏覽器可以產生的聲音聲明一個給定頻率。頻率值可以表示為赫茲（Hz）或兆赫（MHz），而且不能是負值。值后面跟的標簽（Hz或MHz）不區分大小寫，因此10MHz和1OMhz是一樣的。

在寫這本書時，已經知道的支持所有這些值的唯一一個用戶代理是Emacspeak，這是一個聲音樣式表實現。有關聲音樣式的更多詳細信息見第14章。

除了這些值以外，還有一個“老朋友”，不過它有了一個新名字，這就是URI (Uniform Resource Identifier，統一資源標識符），這是統一資源定位符（Uniform Resource Locator, URL）的另一個名字。CSS2和CSS2.1規范都要求URI要以url (...)形式聲明，因此實際上沒有什么改變。

小結

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

這些單位都各有優缺點，這取決于它們在什么情況下使用。我們已經了解了這樣的一些環境，本書余下的內容將重點討論這些場合，首先從CSS屬性開始，CSS屬性描述了如何改變文本的顯示方式。