css3新增的選擇器:“[attribute^=value]”、“[attribute$=value]”、“[attribute*=value]”、“:first-of-type”、“:root”、“:empty”、“:target”等等。
讓客戶(hù)滿(mǎn)意是我們工作的目標(biāo),不斷超越客戶(hù)的期望值來(lái)自于我們對(duì)這個(gè)行業(yè)的熱愛(ài)。我們立志把好的技術(shù)通過(guò)有效、簡(jiǎn)單的方式提供給客戶(hù),將通過(guò)不懈努力成為客戶(hù)在信息化領(lǐng)域值得信任、有價(jià)值的長(zhǎng)期合作伙伴,公司提供的服務(wù)項(xiàng)目有:域名與空間、網(wǎng)頁(yè)空間、營(yíng)銷(xiāo)軟件、網(wǎng)站建設(shè)、永德網(wǎng)站維護(hù)、網(wǎng)站推廣。
本教程操作環(huán)境:windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
一、屬性選擇器:1、[attribute^=value]匹配屬性值以指定值開(kāi)頭的每個(gè)元素。
2、[attribute$=value]匹配屬性值以指定值結(jié)尾的每個(gè)元素。
3、[attribute*=value]匹配屬性值中包含指定值的每個(gè)元素。
二、偽元素和偽類(lèi)選擇器:選擇器示例示例說(shuō)明CSS:first-of-typep:first-of-type選擇每個(gè)p元素是其父級(jí)的第一個(gè)p元素3:last-of-typep:last-of-type選擇每個(gè)p元素是其父級(jí)的最后一個(gè)p元素3:only-of-typep:only-of-type選擇每個(gè)p元素是其父級(jí)的唯一p元素3:only-childp:only-child選擇每個(gè)p元素是其父級(jí)的唯一子元素3:nth-child(n)p:nth-child(2)選擇每個(gè)p元素是其父級(jí)的第二個(gè)子元素3:nth-last-child(n)p:nth-last-child(2)選擇每個(gè)p元素的是其父級(jí)的第二個(gè)子元素,從最后一個(gè)子項(xiàng)計(jì)數(shù)3:nth-of-type(n)p:nth-of-type(2)選擇每個(gè)p元素是其父級(jí)的第二個(gè)p元素3:nth-last-of-type(n)p:nth-last-of-type(2)選擇每個(gè)p元素的是其父級(jí)的第二個(gè)p元素,從最后一個(gè)子項(xiàng)計(jì)數(shù)3:last-childp:last-child選擇每個(gè)p元素是其父級(jí)的最后一個(gè)子級(jí)。3:root:root選擇文檔的根元素3:emptyp:empty選擇每個(gè)沒(méi)有任何子級(jí)的p元素(包括文本節(jié)點(diǎn))3:target#news:target選擇當(dāng)前活動(dòng)的#news元素(包含該錨名稱(chēng)的點(diǎn)擊的URL)3:enabledinput:enabled選擇每一個(gè)已啟用的輸入元素3:disabledinput:disabled選擇每一個(gè)禁用的輸入元素3:checkedinput:checked選擇每個(gè)選中的輸入元素3:not(selector):not(p)選擇每個(gè)并非p元素的元素3::selection::selection匹配元素中被用戶(hù)選中或處于高亮狀態(tài)的部分3:out-of-range:out-of-range匹配值在指定區(qū)間之外的input元素3:in-range:in-range匹配值在指定區(qū)間之內(nèi)的input元素3:read-write:read-write用于匹配可讀及可寫(xiě)的元素3:read-only:read-only用于匹配設(shè)置 "readonly"(只讀) 屬性的元素3:optional:optional用于匹配可選的輸入元素3:required:required用于匹配設(shè)置了 "required" 屬性的元素3:valid:valid用于匹配輸入值為合法的元素3:invalid:invalid用于匹配輸入值為非法的元素3三、層級(jí)選擇器:E~F
通用選擇器 (找后面的所有同輩元素)
選擇匹配的F元素,且位于匹配的E元素后的所有匹配的F元素
(學(xué)習(xí)視頻分享:css視頻教程)