1. 程式人生 > >css屬性選擇器,[],=, ~=, ^=, ~=, $=, |=等符號含義

css屬性選擇器,[],=, ~=, ^=, ~=, $=, |=等符號含義

全棧工程師開發手冊 (作者:欒鵬)

css屬性選擇器

包括[]是否有某屬性,=屬性是否等於,~=屬性不等於,^=屬性值以指定字串開頭,$=屬性值以指定字串結尾,*=屬性值等於指定字串,|=屬性值以指定字串為字首。
程式碼如下:

p[attribute1][attribute2]{         /*  [] 屬性選擇器,表示具有某種屬性的所有元素,多個引數表示同時具有多個屬性,class也可以作為一個屬性篩選 */
}
a[href="http://www.123.com"]{      /*  =具有某個屬性,且屬性值等於指定值的所有元素 */
}
div[class~="class1"]
{ /* ~=具有某個屬性,且屬性值包含指定值的所有元素 */ } input[title^="title1"]{ /* ^=指定屬性的值以指定字串開頭 */ } input[title$="title1"]{ /* $=指定屬性的值以指定字串結尾 */ } input[title*="title1"]{ /* *=指定屬性的值包含指定字串 */ } input[title|="title1"]{ /* |=指定屬性的值等於title1或者以title1-開頭 */
}