任性配圖，內(nèi)容無關(guān)

1，CSS選擇器常見的有幾種?

• 基礎(chǔ)選擇器（id選擇器#id{}、class選擇器.class{}、通用副選擇器#{}、標(biāo)簽選擇器p{}）
• 組合選擇器（組合選擇器）
• 屬性選擇器（屬性選擇器）
• 偽類選擇器（：hover、：active等）
• 偽元素選擇器（:before、:after、:first-line）

2，選擇器的優(yōu)先級是怎樣的?

優(yōu)先級從先到后排列依次為：

1. 在屬性后面使用!important會覆蓋頁面內(nèi)任何位置定義的元素樣式；
2. 作為style屬性寫在標(biāo)簽上的內(nèi)聯(lián)屬性。例如<p style="color:red">優(yōu)先級</p>
3. id選擇器 #id{}
4. 類選擇器 .class{}
5. 偽類選擇器 :hover{}
6. 屬性選擇器 div[class=text]
7. 標(biāo)簽選擇器 element
8. 通配符選擇器 *
9. 瀏覽器默認(rèn)樣式

3，class 和 id 的使用場景?

id因其唯一性一般使用在較大級上，而class因其同類性則都可以。

4，使用CSS選擇器時為什么要劃定適當(dāng)?shù)拿臻g？

防止失誤，方便閱讀。

5，以下選擇器分別是什么意思?

答案直接在圖里

6，列出你知道的偽類選擇器

偽類

• ：hover{}
• ：active{}

偽元素：

• :before{}
• :after{}

7，:first-child和:first-of-type的作用和區(qū)別

• :first-child 匹配的是某父元素的第一個子元素，可以說是結(jié)構(gòu)上的第一個子元素。
• :first-of-type 匹配父元素下使用同種標(biāo)簽的第一個子元素
  舉例如下：

first-child不成立；first-of-type成立。則 `<p>我是老大</p>`變紅

都成立，`<p>我是老大</p>`既變大又變綠

8，運(yùn)行如下代碼，解析下輸出樣式的原因。

:first-child：是父元素下的第一個子元素，在item1中，<p class="item1">aa</p>是第一個子元素，因此顏色變紅。
:first-of-type：是父元素下同一標(biāo)簽的第一個子元素。這里<p class="item1">aa</p>是<p>標(biāo)簽第一個子元素，被涂藍(lán)；<h3 class="item1">bb</h3>是h3的一個子元素，也被涂藍(lán)。

9，text-align: center的作用是什么，作用在什么元素上？能讓什么元素水平居中

• text-align：center：將塊級元素（文字、inline元素、inline-block元素）水平居中。

10，如果遇到一個屬性想知道兼容性，在哪查看?

can i use

啊~~~完成！