偽類選擇器
偽類選擇器骂因,就是基于元素當(dāng)前所處的抓奶來選取元素,由于狀態(tài)通常是動態(tài)變化的赃泡,當(dāng)元素處于一個特定狀態(tài)時寒波,他可能得到一個偽類的樣式;當(dāng)狀態(tài)改變是升熊,他又會失去這個樣式俄烁。由此可知,它是基于文檔之外的抽象级野,所以稱作偽類页屠。
偽類選擇器是css中已經(jīng)定義好的選擇器,不能有用戶隨便起名蓖柔,只能按css規(guī)定的標(biāo)準(zhǔn)格式進(jìn)行使用辰企。其語法為:
選擇器:偽類名{屬性:值;}
選擇器 | 功能描述 | 版本 |
---|---|---|
E:link | 選擇未被訪問過的鏈接 | 1 |
E:visited | 選擇已被訪問過的鏈接 | 1 |
E:active | 選擇被激活(即鼠標(biāo)已經(jīng)按下還未釋放)的E元素 | 1 |
E:hover | 選擇鼠標(biāo)懸停其上的E元素 | 1 |
E:focus | 選擇獲得焦點的E元素 | 1 |
在HTML中渊抽,超鏈接是指所有帶有href屬性的a元素蟆豫。可以使用鏈接偽類來區(qū)分未訪問的鏈接和已訪問的鏈接:
a:link { color : blue;}
a:visited { color : purpel;}
當(dāng)然懒闷,對于鏈接偽類十减,不僅可以應(yīng)用顏色,還可以應(yīng)用更多樣式愤估。如帮辟。對于已訪問的鏈接,除了紫色外玩焰,還可以有一條刪除線由驹。
盡管:link
和:visted
非常有用,但他們是靜態(tài)的,第一是現(xiàn)實之后蔓榄,他們不會再改變元素的樣式并炮。并且他們只用于錨元素,因此被稱作鏈接偽類或錨偽類甥郑。
而:hover逃魄、:focus、:active
則不同澜搅,他們可以根據(jù)用戶行為動態(tài)改變文檔的外觀伍俘,故被稱為動態(tài)味蕾,或用戶行為偽類勉躺。
最初癌瘾,動態(tài)偽類總是用來設(shè)置超鏈接的樣式,不過現(xiàn)在他們可以應(yīng)用到任何元素饵溅。如在表格上使用:hover
偽類妨退,表單的文本輸入框是使用:focus
偽類,表單的提交按鈕上使用:active
偽類等蜕企。如:
tr:hover {
background:#cld5eb;
}
input:focus {
outline: 1px solid #cld5eb;
}
另外碧注,還可以把鏈接偽類結(jié)合在一起使用,來創(chuàng)造更豐富的樣式糖赔。如萍丐,定義已被訪問鏈接的懸停效果:
a: visited : hover {
color: #8888;
哪種書寫順序并不重要,a:visited:hover
和a:hover:visited
將會得到相同的效果放典。但是不要把互斥的類結(jié)合在一起逝变,如,一個鏈接不能同時是未訪問和已訪問狀態(tài)奋构,因此a:link:visited
沒有任何意義壳影。