首页 > 代码库 > css3 选择器

css3 选择器

1.选择id为ul1里所以的奇数项

#ul1 li:nth-child(odd)

{

color:#fff;

}

注:id为ul1里所以的奇数项的字体颜色变成白色

2.选择id为ul1里所以的偶数项

#ul2 li:nth-child(even)

{

color:#fff;

}

注:id为ul1里所以的偶数项的字体颜色变成白色

3. 选择a元素的src属性以abc开头的每个a元素。

a[src^="a"]

{

border:1px solid #f00;

}

注:a元素的src属性以abc开头的每个a元素加个边框。

4.选择a元素的src属性以abc结尾的每个a元素。

a[src$="a"]

{

border:1px solid #f00;

}

注:a元素的src属性以abc结尾的每个a元素加个边框。

5.选择a元素的src属性值包含abc的每个a元素。

a[src*="a"]

{

border:1px solid #f00;

}

注:选择a元素的src属性值包含abc的每个a元素加个边框。

6.选择前面有div元素的每个ul元素

div~ul

{

border:1px solid #f00;

}

注:前面有div元素的每个ul元素加个边框。

7.选择每个禁用的input元素

input:disabled

{

border-color: #f00;

}

注:每个禁用的input元素的背景颜色变成红色。

8.选择每个启用的input元素

input:enabled

{

border-color: #f00;

}

注:每个启用的input元素的背景颜色变成红色。

9.选择父元素里第二个子元素的所以的p标记

p:nth-child(2)

{

color: #f00;

}

注:父元素里的第二个子元素的所以的p标记的字体颜色变成红色。

css3 选择器