1. HTML、XML、XHTML 有什么區別
HTML被設計用來顯示數據，焦點是數據的外觀
XML被設計用來描述數據，焦點是數據的內容，并且標簽沒有自定義，全部需要自己定義
XHTML是居于可擴展標記語言的標記語言，也是HTML的一個子集，格式比HTML更加嚴謹
2. 怎樣理解HTML的語義化
語義化是指根據內容的結構化（內容語義化），選擇合適的標簽（代碼語義化），便于開發者閱讀和寫出更優雅的代碼的同時，讓瀏覽器的爬蟲和機器很好的解析。
語義化的目的是
- 為了在沒有CSS的情況下，頁面也能呈現出很好地內容結構、代碼結構（為了裸奔時好看）
- 提升用戶體驗：例如title、alt用于解釋名詞或解釋圖片信息、label標簽的活用
- 有利于SEO「Search Engine Optimization」：和搜索引擎建立良好溝通，有助于爬蟲抓取更多的有效信息：爬蟲依賴于標簽來確定上下文和各個關鍵字的權重
- 方便其他設備解析（如屏幕閱讀器、盲人閱讀器、移動設備）以有意義的方式來渲染網頁；
- 便于團隊開發和維護，語義化更具可讀性，是下一步網頁設計的重要動向，遵循W3C標準的團隊都遵循這個標準，可以減少差異化。
如何語義化
- 盡可能少的使用無語義的標簽div和span；
- 在語義不明顯時，既可以使用div或者p時，盡量用p, 因為p在默認情況下有上下間距，對兼容特殊終端有利；
- 不要使用純樣式標簽，如：b、font、u等，改用css設置。
- 需要強調的文本，可以包含在strong或者em標簽中（瀏覽器預設樣式，能用CSS指定就不用他們），strong默認樣式是加粗（不要用b），em是斜體（不用i）；
- 使用表格時，標題要用caption，表頭用thead，主體部分用tbody包圍，尾部用tfoot包圍。表頭和一般單元格要區分開，表頭用th，單元格用td；
- 表單域要用fieldset標簽包起來，并用legend標簽說明表單的用途；
- 每個input標簽對應的說明文本都需要使用label標簽，并且通過為input設置id屬性，在lable標簽中設置for=someld來讓說明文本和相對應的input關聯起來。
3. 怎樣理解內容與樣式分離的原則
指的的HTML上只應該設置內容與結構，不使設置具體樣式
這樣的做的好處是
- 利用CSS中的重用、組合、繼承等特性減少樣式的代碼量，樣式結構上非常清晰；
- 頁面視覺有變動只需要修改相應的CSS文件，不用或者基本上不用改動html文檔中的標簽結構；
- 方便JavaScript腳本編寫，比如用js控制標簽的className來方便的、動態的改變元素的樣式，而不是直接修改其具體樣式
- 適合產品級、模塊化的開發
- 提高可讀性，方便后續維護、修改和替換
樣式應該單獨在CSS中設置，在html中引用
使用JavaScript的地方，同樣應當如此
4. 有哪些常見的meta標簽
meta的官方定義:
meta標簽提供關于HTML文檔的元數據。元數據不會顯示在頁面上，但是對于機器是可讀的。它可用于瀏覽器（如何顯示內容或重新加載頁面），搜索引擎（關鍵詞），或其他 web 服務。
<meta charset="utf-8">
申明編碼，避免網頁內的漢字變成亂碼<meta name="Keyword" content="關鍵字">
描述網頁關鍵字，用于搜索引擎搜索<meta name="Description" content="網頁內容">
不超過150字，且能準確描述網頁內容的標簽<meta name="robots" content="index,flow">
robot terms是使用一組用","分開的值
1. all：文件將被檢索，且頁面上的鏈接可以被查詢
2. none：文件將不被檢索，且頁面上的鏈接不可以被查詢
3. index：文件將被檢索
4. follow：頁面上的鏈接可以被查詢
5. noindex：文件將不被檢索
6. nofollow：頁面上的鏈接不可以被查詢
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
根據不同設備，以及窗口大小調整內容<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
選擇瀏覽器內核，優先選擇chrome內核，如果不支持，則優先選擇edge版的IE內核
5. 文檔聲明的作用?嚴格模式和混雜模式指什么?<!doctype html> 的作用?
web中有許多的文檔類型，就算是html，也有不同的版本，所以需要文檔開頭說明文檔類型，讓瀏覽器能正確顯示文檔
<!doctype html> 處于<html>標簽之前，告知瀏覽器以何種形式渲染文檔嚴格排版模式會使瀏覽器用支持的最高web標準來解析頁面，是一種嚴格要求的DTD(Document Type Definition)不允許使用任何表現層的標識和屬性
混雜模式是一種向后兼容的解析方法，通常模擬老式瀏覽器的行為，以防止老站點無法工作
6.瀏覽器亂碼的原因是什么？如何解決
- 造成瀏覽器亂碼的主要是由于，html源代碼中的文字內容與html編碼不同造成的
- 加入<meta charset>編碼標簽規定好編碼可以避免此種原因造成的亂碼
7.常見的瀏覽器有哪些，什么內核
Trident內核 ： IE,MaxThon,TT,The World,360,搜狗瀏覽器等。[又稱MSHTML]
Gecko內核 ： Netscape6及以上版本，FF,MozillaSuite/SeaMonkey等
Presto內核 ： Opera7及以上。 [Opera內核原為：Presto，現為：Blink;]
Webkit內核 ： Safari,Chrome等。 [ Chrome的：Blink（WebKit的分支）]
8.列出常見的標簽，并簡單介紹這些標簽用在什么場景
<html> 開始標簽
<head> 網頁上的控制信息
<title> 頁面標題 </title>
</head>
<body> 包括所有 頁面顯示的內容
<h1~6></h1~6> 頁面標題，1~6重要程度依次遞減
<p></p> 段落，前后若有其他，執行前后換行，并空開一行，保證自身是一個整體
<div></div> 層標簽（默認占一行）
<span></span> 層標簽（默認用多大空間占多大空間）
<ol> 有序列表
<li>內容</li>
<li>內容</li>
</ol>
<ul> 無序列表
<li>內容</li>
<li>內容</li>
</ul>
 圖片標簽，圖片無法加載時會顯示alt中文字
<a target="_blank" title="xxx">xxx.com</a> 超鏈接
<dl> 用于展示一系列 “標題:內容... ”的場景
<dt>商品名稱:</dt>
<dd>青花瓷</dd>
<dt>特征:</dt>
<dd>白色</dd>
<dd>圓口</dd>
<dt>商品介紹</dt>
<dd>這是一個年代久遠的瓷器，很貴，易碎</dd>
</dl>
<button>點我</button> 按鈕
<iframe src="http://jirengu.com" name="myPage"></iframe> 嵌入頁面
</body>
</html> 結束標簽
