复合选择器

复合选择器

交集选择器

作用:选中同时复合多个条件的元素

语法:选择器1选择器2选择器3选择器n{}

注意点:交集选择器中,如果有元素选择器,必须使用元素选择器的开头

<head>
   <style>
       .red{
   color: red;
}
div.red{
   font-size: 90px;
}
   </style>
</head>
<body>
   
<h1>这是一个标题</h1>
<p class="red">这是一个class</p>
<p class="red">这是一个class</p>
<p class="red">这是一个class</p>
<div class="red">这是一个div</div>
<span>嘻嘻嘻嘻嘻</span>
   
</body>

选择器分组(并集选择器)

作用:同时选择多个选择器对应的元素

语法:选择器1,选择器2,选择器n{}

<head>
   <style>
       .red{
   color: red;
}
div.red{
   font-size: 90px;
}
h1, span{
   color: seagreen;
}
   </style>
</head>
<body>
   
<h1>这是一个标题</h1>
<p class="red">这是一个class</p>
<p class="red">这是一个class</p>
<p class="red">这是一个class</p>
<div class="red">这是一个div</div>
<span>嘻嘻嘻嘻嘻</span>
   
</body>

 

posted on 2020-05-17 07:42  厌红尘  阅读(263)  评论(0)    收藏  举报

导航