CSS3属性选择器
<div id="section1"> ⽰例⽂本1</div>
<div id="subsection1-1">⽰例⽂本1-1</div>
<div id="subsection1-2">⽰例⽂本1-2</div>
<div id="section2">⽰例⽂本2</div>
<div id="subsection2-1">⽰例⽂本2-1</div>
<div id="subsection2-2">⽰例⽂本2-2</div>
CSS2中使⽤属性选择器来设置
<style type=text/css>
[id = section1]{
css选择器分为哪几类background:yellow;
}
</style>
CSS3中的属性选择器
1.[att*=val]属性值包含⽤val指定的字符
[id*=section]{
background:yellow;
}
则页⾯中id为"section1"、"subsection1-1"、"subsection1-2"的div元素的背景⾊都变为黄⾊，因为这些元素的id属性中都包含"section"字符。
2.[att^=val]属性值的开头字符为⽤val指定的字符，则该元素使⽤这个样式
[id^=val]{
background:yellow;
}
页⾯中id为"section1"、"section2"的div元素的背景⾊都变为黄⾊，因为这些元素的id属性的开头字符都为"section"。
3.[att$=val]结尾字符为⽤val指定的字符
[id$=\-1]{
background:yellow;
}
页⾯中为"subsection1-1"、"subsection2-1"的div元素的背景⾊变为黄⾊，因为其以"-1"结尾。
注意：要在指定的匹配字符前必须加上"\"这个escape字符。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。