层叠和特殊性
<head>
<meta charset="UTF-8">
<title>Chapter 2</title>
<style type="text/css">
#content div#main-content h2{
color:gray;
}
#content #main-content>h2{
color:blue;
}
body #content div[id="main-content"] h2{
color:green;
}
#main-content div.news-story h2{
color:orange;
}
#main-content [class="news-story"] h2{
color:yellow;
}
div#main-content div.news-story h2.first{
color:red;
}
</style>
</head>
<body>
<div id="content">
<div id="main-content">
<h2>Strange Times</h2>
<p>Here you can read bizarre new stories from around</p>
<div class="news-story">
<h2 class="first">Bog Snorkeling Champion</h2>
<p>The 2088 bog</p>
</div>
</div>
</div>
</body>
这里的结果就是Strange Times和Bog Snorkeling都是灰色的，因为第一个选择器中有两个ID选择器组成，因此它具有最高特殊性
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
