一.??? 如何理解HTML結(jié)構(gòu)的語義化？

1. 去掉或樣式丟失的時候能讓頁面呈現(xiàn)清晰的結(jié)構(gòu)。

2. 方便其他設(shè)備解析（如屏幕閱讀器、盲人閱讀器、移動設(shè)備）以有意義的方式來渲染網(wǎng)頁。

3. 有利于SEO：和搜索引擎建立良好溝通，有助于爬蟲抓取更多的有效信息：爬蟲依賴于標簽來確定上下文和各個關(guān)鍵字的權(quán)重。

4. 便于團隊開發(fā)和維護。

二.??? 談?wù)勔郧岸私嵌瘸霭l(fā)做好SEO需要考慮什么？

1. 了解搜索引擎如何抓取網(wǎng)頁和如何索引網(wǎng)頁。

2. Meta標簽優(yōu)化。

3. 如何選取關(guān)鍵詞并在網(wǎng)頁中放置關(guān)鍵詞。

4. ?了解主要的搜索引擎。

5. 主要的互聯(lián)網(wǎng)目錄

6. 按點擊付費的搜索引擎。

7. 搜索引擎登錄。

8. 鏈接交換和鏈接廣泛度（Link Popularity）。

9. 標簽的合理使用。

三.??? 引入CSS有哪些方式，有什么區(qū)別？

1. 內(nèi)聯(lián)樣式（行內(nèi)樣式）：

2. 嵌入樣式：

3. 鏈接引入：在head部分加入link標簽，引入外部的CSS文件

4. 導入樣式：通過@import在<style>標簽中進行聲明：

5. link和@import之間的區(qū)別：

????????1）link是HTML標簽，不僅可以加載 CSS 文件，還可以定義 RSS、rel 連接屬性等；@import是?CSS?提供的語法規(guī)則，只有導入css的作用。

????????2）加載頁面時，link標簽引入的 CSS 被同時加載；@import引入的 CSS 要在頁面加載完畢后被加載，所以會出現(xiàn)一開始沒有CSS樣式，閃爍后出現(xiàn)樣式的問題。

????????3）@import是 CSS2.1 才有的語法，故只可在 IE5+ 才能識別；link作為HTML標簽，不存在兼容性問題。

????????4）link可以通過 JS 操作 DOM來改變樣式；@import則不支持（由于?DOM?方法是基于文檔的）。

四. src和href的區(qū)別

1. href（Hypertext Reference 超文本引用）超鏈接，建立當前文檔或元素與引用資源之間的連接，需要引用資源的時候就可以通過這個連接引用。

2. src（資源）會把資源下載下來，代替當前元素然后嵌入到文檔中。

五、偽類和偽元素的區(qū)別

1. 偽類 單冒號；偽元素 雙冒號。

2. 一個css選擇符只能有一個偽元素；但可以有多個偽類。

3. 多個偽類可以拼接；偽元素不可以。

4. 偽元素只能處于選擇符的最后方；而偽類可以在選擇符的前方和后方，還可以與偽元素拼接在一起排在偽元素的前方。

5. 偽類基于DOM不產(chǎn)生新對象；而偽元素創(chuàng)建一個不存在DOM中的新對象，并且可以對這個新對象進行操作。

6. 偽類選擇器：?? 有狀態(tài)類=> :link\:visited\:hover\:active\:foucs? ? ? ? 結(jié)構(gòu)類=> :first-child\:last-child\:nth-child\:last-of-type? ? ? ?表單類=> :checked\:disabled\:valid\:required? ? ? ? ?語言類=> :dir\:lang? 等

7. 偽元素：? ?::after\::before\::first-letter\::first-line\::selection\::placeholder\::backdrop

六、圣杯布局

布局：三欄結(jié)構(gòu)，左欄和右欄都是固定的寬度，中間欄的寬度會變化。

兩種方式：

第一種定位+布局方法：

第二種flex布局方法：

七、雙飛翼布局

????與圣杯的區(qū)別是：給center部分加上一個內(nèi)置的小盒子inner，給inner設(shè)置左右邊距防止center兩邊的內(nèi)容被左右盒子覆蓋。