問(wèn)題1 ：id和class的應(yīng)用場(chǎng)景
- id：指定標(biāo)簽的唯一標(biāo)識(shí)，每個(gè)ID在文檔中必須是唯一的
- class：指定標(biāo)簽的類(lèi)名，文檔中的多個(gè)元素可以擁有同一個(gè)類(lèi)名
問(wèn)題2：哪些常見(jiàn)的css選擇器
1.基礎(chǔ)選擇器：*径筏、#id屬性值漏峰、.class屬性值膜蠢、標(biāo)簽
2.組合選擇器：多元素選擇器堪藐、后代選擇器莉兰、子元素選擇器等
3.屬性選擇器：如input[type=text] {width: 100px;}
4.偽類(lèi)選擇器：用來(lái)給選擇器添加些效果，如a:hover {color: red;}
5.偽元素選擇器：如.wrap::before {content: "aa";}
問(wèn)題3-1：選擇器優(yōu)先級(jí)
1.在屬性后面使用!important會(huì)覆蓋頁(yè)面內(nèi)任何位置定義的元素樣式
2.作為style屬性寫(xiě)在元素標(biāo)簽上的內(nèi)聯(lián)樣式
3.id選擇器
4.class選擇器
5.偽類(lèi)選擇器
6.屬性選擇器
7.標(biāo)簽選擇器
8.通配符（*）選擇器
9.瀏覽器自定義
問(wèn)題3-2：復(fù)雜場(chǎng)景如何計(jì)算優(yōu)先級(jí)
方法：對(duì)選擇器進(jìn)行權(quán)重計(jì)算
- 行內(nèi)樣式等于a
- id選擇器等于b
- class礁竞、偽類(lèi)及屬性選擇器等于c
- 標(biāo)簽選擇器贮勃、偽元素等于d
a>b>c>d，如果上級(jí)相等苏章，對(duì)比同級(jí)值的大小
問(wèn)題4：a:link, a:hover, a:active, a:visited 的順序是怎樣的？ 為什么奏瞬？
順序：a:link枫绅、a:visited 、a:hover硼端、a:active（“愛(ài)恨原則”（LoVe/HAte））
原因：瀏覽器是按照就近原則來(lái)解釋的并淋，也就是從下到上。
一個(gè)未被訪問(wèn)過(guò)的a標(biāo)簽在鼠標(biāo)經(jīng)過(guò)時(shí)同時(shí)具有l(wèi)ink,hover 兩個(gè)屬性珍昨，而如果link標(biāo)簽在后面县耽，那么就仍然顯示link的效果，忽略hover镣典。同理兔毙，如果hover 在 visisted 前，那么hover仍然會(huì)被忽略兄春。
問(wèn)題5
| 選擇器 | 含義 |
|---|---|
| #header | id=header的元素 |
| .header .logo | class=header元素下class=ogo的子元素 |
| .header.mobile | 同時(shí)擁有class=header和class=mobile的元素 |
| .header p, .header h3 | class=header下p標(biāo)簽的子元素和class=header下h3標(biāo)簽的子元素 |
| #header .nav>li | id=header元素下class=nav的子元素下直接擁有l(wèi)i標(biāo)簽的元素 |
| #header a:hover | id=header元素下滿(mǎn)足a:hover屬性的子元素 |
| #header .logo~p | id=header元素下class為logo之后的同級(jí)p元素 |
| #header input[type="text"] | id=header元素下滿(mǎn)足input[type="text"]屬性的子元素 |
問(wèn)題6:熟知的偽類(lèi)選擇器
- a:link澎剥、a:visited、a:active赶舆、a:hover
- a:checked哑姚、a:selected
- a:first-child、a:nth-child(n)
問(wèn)題7
div:first-child芜茵、div:first-of-type叙量、div :first-child和div :first-of-type
div:first-chlid匹配的是div父元素的第一個(gè)子元素，在上圖中九串，第一個(gè)子元素為h4標(biāo)簽內(nèi)的元素绞佩，與div標(biāo)簽不符，故樣式無(wú)顯示猪钮。
div:first-of-type匹配的div父元素下第一個(gè)標(biāo)簽為div的子元素征炼。
div :first-child：div下的第一個(gè)子元素
div :first-of-type：div子元素中，相同類(lèi)型的第一個(gè)
問(wèn)題8
- aa顏色為紅：class="item1"的第一個(gè)子元素
- aa躬贡、bb背景為藍(lán)色：class="item1"中相同類(lèi)型的第一個(gè)
