溫故而知新能夠爲師矣。今天回看《CSS權威指南》發現了一個有趣的問題「靜態僞類」。
在說靜態僞類以前,想先問問各位,若是讓一個連接點擊前爲藍色,點擊後變爲紅色,應該怎麼作?
是這樣嗎?html
a {color: blue}; a:visited {color:red};
應該沒錯,不是嗎?老實說我之前也這麼作。可是若是html結構變成下面這樣,事情就有點複雜了:瀏覽器
<a name='anchor'>come here!</a> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodoconsequat. Duis aute irure dolor in reprehenderit in voluptate velit essecillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat nonproident, sunt in culpa qui officia deserunt mollit anim id est laborum. </p>`` <a href='#anchor'>go</a> <a href='google.com'>google it</a>
注意到了嗎,這段html結構中有一個「錨」標籤,它沒有href特性,而有name特性。但點擊下方的go時,頁面會被定爲至'come here'區域。總之,那並非一個嚴格意義上的連接,可是咱們的連接樣式卻影響到它,這可能不是咱們所但願的。
所以,在這種狀況下,咱們應該將樣式表寫成這樣:緩存
a:link{color:blue}; a:visited{color:red};
這樣,就能夠避免錨標籤的樣式被意外的「污染」了。由於「:link」僞類意味着「選擇未被點擊的連接」。ide
結束了?並無。在實踐過程當中我發現一個頗有趣的現象,當我在瀏覽器中點擊一個連接後,不管我清空緩存,關閉頁面並從新打開,瀏覽器都會識別出已點擊的連接。這是怎麼回事呢?我猜測是瀏覽器本身悄悄的維護着一個「連接清單」,會一直追蹤被點擊後的連接並標記,而這個清單對於開發者而言也是不可訪問的。你也許會問「那我是否是能夠根據網頁連接點擊後的顏色來判斷用戶訪問過的網頁連接呢?」真是個聰明的想法,惋惜的是這方法在不久以前還有用,可是目前這條路已經被瀏覽器封住了,開發人員用腳本訪問連接顏色時,將會始終得到連接的:link下顏色值,真使人遺憾,是否是?ui