web前端-css小记(2)

1. class 和 id 的使用场景?

1. class：类选择器，不限于只针对单个元素使用，若有若干个元素要使用相同样式可以定义相同class名。

2. id：ID选择器，每个标签有且只有一个id，且不能和其他标签重名，所以id选择器只能控制单个元素。

2. CSS选择器常见的有几种?

3. 选择器的优先级是怎样的?对于复杂场景如何计算优先级？

4. a:link, a:hover, a:active, a:visited 的顺序是怎样的？ 为什么？

正确的顺序为a:link、a:visited、a:hover、a:active (其中，link和visited可以互换)
1.鼠标经过的“未访问链接”同时拥有a:link、a:hover两种属性，后面的属性会覆盖前面的属性定义；
2.鼠标经过的“已访问链接”同时拥有a:visited、a:hover两种属性，后面的属性会覆盖前面的属性定义；
所以说，a:hover定义一定要放在a:link、a:visited的后面,

5. 以下选择器分别是什么意思?

6. 列出你知道的伪类选择器

7. div:first-child、div:first-of-type、div :first-child和div :first-of-type的作用和区别

8. 运行如下代码，解析下输出样式的原因

 <style>
.item1:first-child{
  color: red;                        /*指定父元素中第一个类名为item1的元素的字体颜色为红色*/
}
.item1:first-of-type{
  background: blue;                  /*父元素中每一类元素的第一个类名为item1的元素的背景色为蓝色*/
}
</style>
 <div class="ct">
   <p class="item1">aa</p>
   <h3 class="item1">bb</h3>
   <h3 class="item1">ccc</h3>
 </div>                                      /*aa，bb一行显示的是蓝色，ccc一行不显示颜色*/

（mission7）