告訴瀏覽器以何種規範（html/xhtml）進行解析頁面
雖然div+css能達到table一樣的效果。但是改版的時候div+css改的更麻煩，而table只需要改css就行了。table寫的html結構更加簡潔明瞭。頁面渲染速度也能更快。
減少主網域名稱的連線數，增快頁面響應速度
cdn內容分發網路可以很好的解決使用者因寬頻，地理位置等因素所帶來的訪問頁面延遲等問題
節約 cookie寬頻
防止不必要的安全問題
解決瀏覽器併發限制
為了更好的web發展。開發者遵循統一的開發標準，防止濫用**而造成的各種bug。提高**的易用性。
cookie和stroage的區別：
資料大小：cookie ：4kb stroage：5mb
伺服器互動：cookie：伺服器傳送給客戶端；stroage：客戶端本地儲存資料
資料共享： cookie：同源可以共享cookie；localstroage：同一瀏覽器不同頁面可以共享資料；sessionstroage：用ifame標籤進行連線可以共享資料
生命週期：cookie：伺服器進行設定；localstroage：使用者不刪除就會永久存在；sessionstroage：關閉當前標籤頁或跳轉就會被銷毀了。
src：指向外部資源位置。指向的資源會嵌入到當前位置。
href：指向網路資源位置。當前元素會被作為乙個錨點來進行跳轉。
pngjpeg
gifsvg
webp
微格式是一種讓機器可讀的xhtml詞彙的集合。是結構化資料的開放標準。是為特殊應用而生的特殊格式。
早期ie6、7、8各個瀏覽器版本對**的支援程度不同。
quirks模式 如果寫了dtd這個引數，那麼就按新的渲染機制來執行**。
標準模式：ie6開始引入了標準模式。
dns快取
cdn快取
瀏覽器快取
伺服器快取
如果過大。可以優先載入乙個經過壓縮的縮圖。以提高使用者體驗。
如果大於展示區域的大小。可以將壓縮。
了解搜尋引擎是如何抓取網頁或如何索引網頁
掏錢display none
visibility hidden
設定高度為0 透明度為0 z-index為-999
改變a標籤的屬性順序
l-v-h-a（link,visited,hover,active）
針對不同瀏覽寫的不同的css code 就是css hack。
塊級元素：可以設定寬高，內外邊距。獨佔一行。
行元素：不可以設定寬高，內外邊距，有多個行內時，會緊挨著在一行。
相鄰的兩個盒子外邊距可以摺疊成乙個單獨的外邊距。
2個相近的外邊距都是正數時：摺疊結果是大值
2個相近的外邊距都是負數時：摺疊結果是絕對值大值
2個相近的外邊距是一正一負時：摺疊結果是兩個之和。
rgba（）和opacity的透明效果有什麼不同？
px和em都是長度單位，區別是px的值是固定的。指定多少就是多少。
em的值不是固定的。並且em會繼承元素的字型大小。
2個都是針對瀏覽器對css預設樣式的渲染程度不同。初始化預設樣式
reset：老版本初始化預設樣式。
normalize.css：現代化，為h5準備的優質替代方案。
sass、less 是一種css預處理器。將css賦予動態型別的語言。
結構清晰，便於擴充套件
可以多重繼承。**量更少
使用變數函式的形式寫css**。減少無意義的**操作。
完全相容css**。方便應用到老的專案中。
display：none ：將元素隱藏。不佔據文件流
visibility：hidden：元素隱藏。但是佔據文件流。
link：html自帶的屬性。引入的css檔案和頁面同時載入。不存在瀏覽器相容問題
@import：css中自帶的屬性。引入的css檔案等頁面載入完成才會載入css檔案。並且ie5以上才會被識別。
html中所有的元素都是盒子模型，盒子模型有：內容、內邊距、外邊距、邊框組成。
由於瀏覽器相容的問題。不同的瀏覽器對css**的解析渲染會存在差異。避免頁面出現差異。所以我們會初始化css樣式。
bfc（塊級格式化上下文），盒子內是乙個渲染區域。區域內的元素不會影響到盒子外的元素。
用html+css雖然可以達到html語義化標籤的預設樣式。但是修改起來更麻煩**更多。
使用語義化標籤修改與維護更方便。
**結構更加清晰簡單。直觀
頁面渲染速度更快
doctype：告訴瀏覽器以何種規範（html/xhtml）進行頁面的解析
嚴格模式： 頁面排版以及js解析按瀏覽器最高版本進行解析。
混雜模式：相容舊的瀏覽器。向後進行相容。
html：超文字標記語言。
xhtml：html4.0衍生出來的乙個另乙個分支。相比較html來說。更加嚴謹。
標籤前後必須閉合。
標籤名都是必須是小寫
所有的屬性必須用引號""括起來
開發者遵循統一的開發標準
不濫用**而造成各種bug和安全性問題
**更少，改版更加方便。方便修改和維護
**結構更加清晰明確。
塊級元素：div p table ul li form h1-h6
行內：span em i a
行內快：button input label textare img
盒模型：content border padding margin
html：骨架
css：樣式
js：動態互動
doctype：告訴瀏覽器以何種規範（html/xhtml）解析頁面
嚴格模式：瀏覽器以最高版本的渲染機制對css進行渲染。
混雜模式：早期瀏覽器對css**支援程度不同。css**寫的也不同。瀏覽器相容css**。
行內元素：a span em i
行內快：input label textare button img
塊元素：ul li div p table form
空元素：input br hr link meta
兩種盒模型：ie盒模型，w3c盒模型
ie盒子：content包含了border padding
w3c盒子模型：content padding border margin
哪些屬性可以繼承
優先順序演算法：!important>id>class>tag
css3新增的偽類：屬性選擇器，first-of-type，last-of-type，nth-child（），：enabled，disabled，checked，only-child、
大廠高階前端面試題答案
使用過的koa2中介軟體 koa body原理 有沒有涉及到cluster 介紹pm2 pm2是node程序管理工具，可以利用它來簡化很多node應用管理的繁瑣任務，如效能監控 自動重啟 負載均衡等，而且使用非常簡單 master掛了的話pm2怎麼處理 如何和mysql進行通訊 node為例 rea...
大廠高階前端面試題答案
使用過的koa2中介軟體 koa body原理 有沒有涉及到cluster 介紹pm2 pm2是node程序管理工具，可以利用它來簡化很多node應用管理的繁瑣任務，如效能監控 自動重啟 負載均衡等，而且使用非常簡單 master掛了的話pm2怎麼處理 如何和mysql進行通訊 node為例 rea...
大廠高階前端面試題答案
使用過的koa2中介軟體 koa body原理 有沒有涉及到cluster 介紹pm2 pm2是node程序管理工具，可以利用它來簡化很多node應用管理的繁瑣任務，如效能監控 自動重啟 負載均衡等，而且使用非常簡單 master掛了的話pm2怎麼處理 如何和mysql進行通訊 node為例 rea...