屬性選擇器

性選擇器簡介

元素的屬性，咱們都知道是什麼。例以下面代碼中type和value就是input元素的屬性。

屬性選擇器，顧名思義，就是經過屬性來選擇元素的

<input type="text" value="lvye"/>

其實屬性選擇器在CSS2中已經存在了，而CSS3在CSS2的基礎上對屬性選擇器進行了擴展，新增了3個屬性選擇器。對於CSS2中的屬性選擇器，請關注即將上線的CSS進階教程。

E[attr^="lvye"]	選取了元素E，其中E元素定義了屬性att，att屬性值是以lvye開頭的任何字符串。
E[attr$="lvye"]	選取了元素E，其中E元素定義了屬性att，att屬性值是以lvye結尾的任何字符串。
E[attr*="lvye"]	選取了元素E，其中E元素定義了屬性att，att屬性值任意位置是包含了lvye的任何字符串。

（E，指的是元素名element；attr，指的是屬性名attribute）

CSS3新增的這3個屬性選擇器使得選擇器具備通配符的功能，有點正則表達式的感受

咱們在百度文庫下載資料的時候，常常會看到文檔列表的超連接前面都會顯示一個文檔類型的小圖標。

這是用戶體驗很是好的設計細節。這個效果的實現技術，只須要使用CSS3中的屬性選擇器就能夠輕鬆實現了。