1、HTML、XML、XHTML 有什么區(qū)別
- HTML(HyperText Markup Language)：超文本標(biāo)記語言，是語法較為松散的、不嚴(yán)格的web語言；其側(cè)重點(diǎn)是數(shù)據(jù)的外觀，被設(shè)計用來顯示數(shù)據(jù)
- XML（Extensible Markup language），是一種簡單的數(shù)據(jù)存儲語言，使用一系列簡單的標(biāo)記描述數(shù)據(jù)。可擴(kuò)展標(biāo)記語言，主要用于存儲數(shù)據(jù)和結(jié)構(gòu)，其側(cè)重點(diǎn)是數(shù)據(jù)的內(nèi)容；XML標(biāo)簽沒有被預(yù)定義，需自行定義標(biāo)簽。
- XHTML（Extensible HyperText Markup Language），可擴(kuò)展超文本標(biāo)記語言，基于XML的優(yōu)點(diǎn)，語法的書寫格式嚴(yán)格，作用與HTML類似，用來顯示數(shù)據(jù)。實(shí)際上就是更加嚴(yán)謹(jǐn)、準(zhǔn)確的HTML。
在XHML中，元素必須被正確地嵌套；元素必須被關(guān)閉；標(biāo)簽名必須用小寫字母；文檔必須擁有根元素。
2、怎樣理解 HTML 語義化
語義化指選擇合適的標(biāo)簽、使用合理的代碼結(jié)構(gòu)，便于開發(fā)者閱讀，同時讓瀏覽器的爬蟲和機(jī)器很好地解析。
作用：（1）頁面也能呈現(xiàn)出很好的內(nèi)容結(jié)構(gòu)、代碼結(jié)構(gòu)，表達(dá)清晰；（2）便于用戶體驗(yàn)，例如title、alt用于解釋名詞和解釋圖片信息；（3）有利于SEO，和搜索引擎建立良好的溝通，有助于爬蟲抓取更多的有效信息，爬蟲依賴于標(biāo)簽來確定上下文和各個關(guān)鍵字的權(quán)重；（4）方便其他設(shè)備解析（如屏幕閱讀器、盲人閱讀器、移動設(shè)備）以有意義的方式來渲染頁面；（5）便于團(tuán)隊(duì)開發(fā)和維護(hù)，語義化更具可讀性。
3、怎樣理解內(nèi)容與樣式分離的原則？
內(nèi)容、樣式、行為，分離；HTML內(nèi)容，CSS樣式，JS行為、交互。
- 寫HTML的時候先不管樣式，重點(diǎn)放在HTML的結(jié)構(gòu)和語義化上，讓HTML能提現(xiàn)頁面結(jié)構(gòu)或者內(nèi)容。（內(nèi)容與樣式分離）
- 寫JS的時候，盡量不要用JS去直接操作樣式，而是通過給元素添加刪除class來控制樣式變化。（行為分離）
- HTML內(nèi)不允許出現(xiàn)屬性樣式，盡量不要出現(xiàn)行內(nèi)樣式。
4、有哪些常見的meta標(biāo)簽？
meta常用于定義頁面的說明，關(guān)鍵字，最后修改日期，和其它的元數(shù)據(jù)。這些元數(shù)據(jù)將服務(wù)于瀏覽器（如何布局或重載頁面），搜索引擎和其它網(wǎng)絡(luò)服務(wù)。
meta標(biāo)簽，共有兩個屬性，分別是http-equiv屬性和name屬性。
（1）http-equiv屬性:定義http參數(shù)
包括：charset(設(shè)定網(wǎng)頁字符集)，X-UA-Compatible(瀏覽器采取何種版本渲染當(dāng)前頁面)，cache-control(指定請求和響應(yīng)遵循的緩存機(jī)制)，expires(網(wǎng)頁到期時間)，refresh(自動刷新并指向某頁面)，Set-Cookie(cookie設(shè)定)。
（2）name屬性：用于描述網(wǎng)頁，比如網(wǎng)頁的關(guān)鍵詞，敘述等
包括：keywords(關(guān)鍵字)， description(網(wǎng)站內(nèi)容的描述)，viewport(移動端的窗口)， robots(定義搜索引擎爬蟲的索引方式)，author(作者)， generator(網(wǎng)頁制作軟件)，copyright(版權(quán))，revisit-after(搜索引擎爬蟲重訪時間)，renderer(雙核瀏覽器渲染方式)
例：
- <meta charset=”utf-8”> 聲明編碼
- <meta http-equiv=”X-UA-Compatible” content=”IE=edge, chrome=1”> 對于一些雙核瀏覽器，用最新的標(biāo)準(zhǔn)渲染。
- <meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1”>在移動端合理展示。
- <meta name=”keywords” content=”關(guān)鍵詞”> 便于搜索引擎優(yōu)化。
5、文檔聲明的作用?嚴(yán)格模式和混雜模式指什么?<!doctype html> 的作用?
- 文檔聲明作用：告知瀏覽器，以何種方式解析、渲染當(dāng)前頁面。
- 嚴(yán)格模式，有文檔聲明，用來告訴瀏覽器該如何渲染，標(biāo)準(zhǔn)模式指用標(biāo)準(zhǔn)格式來渲染頁面。
- 混雜模式，無文檔聲明，瀏覽器以自己的方式渲染。
- <!DOCTYPE html> 告訴瀏覽器，以HTML5的方式解析、渲染當(dāng)前頁面。
6、瀏覽器亂碼的原因是什么？如何解決？
- 瀏覽器打開頁面時，將編碼和字符串解析成內(nèi)容；若無指明編碼格式，瀏覽器不知道以何種方式來解析編碼，以瀏覽器默認(rèn)的編碼方式進(jìn)行解析，所以容易造成亂碼。常見有中文字符、小語種字符錯誤。
- 解決方式：設(shè)置網(wǎng)頁編碼聲明，即通過設(shè)置charset，并保存為設(shè)置的字符編碼方式，一般設(shè)置為UTF-8。
7、常見的瀏覽器有哪些，什么內(nèi)核？
IE：Trident內(nèi)核
Chrome：blink內(nèi)核
firefox：GECKO內(nèi)核
Safari： WebKit內(nèi)核
Opera Sofeware：Presto內(nèi)核
8、列出常見的標(biāo)簽，并簡單介紹這些標(biāo)簽用在什么場景？
h1-h6 標(biāo)題
p 段落
a 鏈接到一個地址，
img 展示圖片
div標(biāo)簽，用于給頁面劃分區(qū)塊，讓結(jié)構(gòu)更清晰
ul li 無序列表，可以嵌套
ul的直接子元素是li，里面不可以有p，h等標(biāo)簽
ol li 有序列表
dl dt dd 用于展示一系列“標(biāo)題：內(nèi)容....”的場景
<button> </button>
iframe 用于嵌入一個頁面，需要注意跨域操作問題
table 用于展示表格
