1.HTML聂受、XML蒿秦、XHTML 有什么區(qū)別?
從字面上看，他們都是HTML蛋济，都是標(biāo)記語言（Markup Language）
HTML棍鳖，超文本標(biāo)記語言，是語法較為松散的碗旅、不嚴(yán)格的Web語言渡处；
XML，可擴(kuò)展標(biāo)記語言祟辟，主要用于存儲數(shù)據(jù)和結(jié)構(gòu)医瘫，可擴(kuò)展參考；
XHTML川尖，可擴(kuò)展超文本標(biāo)記語言登下，基于XML茫孔，作用與HTML類似叮喳，但語法更嚴(yán)格參考被芳。
2.怎樣理解 HTML 語義化?
簡單說語義化就是讓機(jī)器可以好的讀懂內(nèi)容。對于當(dāng)前的 Web 而言馍悟，HTML 是聯(lián)系大多數(shù) Web 資源的紐帶畔濒。隨著互聯(lián)網(wǎng)的發(fā)展，WEB承載越來越多的信息（圖片锣咒，聲音侵状，視頻等），人們開始用機(jī)器來處理網(wǎng)絡(luò)信息毅整，就此誕生了搜索引擎趣兄。如次龐大及復(fù)雜的信息如何讓搜索引擎處理和挖掘，所以讓機(jī)器能夠更好地讀懂WEB上內(nèi)容就變得越來越重要悼嫉。
Web語義化有三個(gè)階段:
- 瀏覽器和W3C組織推出的如h1~h6艇潭、thead、ul戏蔑、ol的HTML標(biāo)簽蹋凝，用于在Web頁面中組織對應(yīng)的內(nèi)容，如網(wǎng)頁標(biāo)題总棵、表頭鳍寂、無序、有序列表情龄，以達(dá)到更方便的協(xié)作及傳播互聯(lián)網(wǎng)內(nèi)容迄汛。搜索引擎很好的利用了這些語義化標(biāo)簽抓取內(nèi)容，又鑒于搜索引擎的巨大流量推薦骤视，Web前端不得不考慮SEO鞍爱，從而兩者實(shí)現(xiàn)有益的循環(huán)，共同推進(jìn)著語義化標(biāo)簽的使用尚胞。
- 但Web的發(fā)展超乎想象硬霍，起初定義的HTML語義化標(biāo)簽，不足以實(shí)現(xiàn)對Web頁面各個(gè)部分的功能或位置描述笼裳，所以Web前端人員利用HTML標(biāo)簽的id和class屬性唯卖，進(jìn)一步對HTML標(biāo)簽進(jìn)行描述，如對頁腳HTML標(biāo)簽添加如id="footer"或者class="footer"的屬性（值）躬柬，以“無聲”的方式在不同的前端程序員或者前后端程序員間實(shí)現(xiàn)交流拜轨。
- W3C組織意識到了之前HTML版本的不足，推出的HTML5進(jìn)一步推進(jìn)了Web語義化發(fā)展允青，采用了諸如footer橄碾、section等語義化標(biāo)簽，彌補(bǔ)了采用id="footer"或者class="footer"形式的不足，以更好的推動Web的發(fā)展法牲。
語義化可以帶來的好處：
- 清晰的頁面結(jié)構(gòu)：去掉或樣式丟失的時(shí)候史汗，也能讓頁面呈現(xiàn)清晰的結(jié)構(gòu)，增強(qiáng)頁面的可讀性拒垃。
- 支持更多的設(shè)備：屏幕閱讀器（如果訪客有視障）會完全根據(jù)你的標(biāo)記來“讀”你的網(wǎng)頁停撞。 如果你使用的含語義的標(biāo)記，屏幕閱讀器會根據(jù)你的標(biāo)簽來判斷網(wǎng)頁的內(nèi)容悼瓮，而不是一個(gè)字母一個(gè)字母的拼寫出來戈毒。
- 有利于SEO：和搜索引擎建立良好溝通，有助于爬蟲抓取更多的有效信息横堡，搜索引擎的爬蟲也依賴于標(biāo)記來確定上下文和各個(gè)關(guān)鍵字的權(quán)重埋市。
- 便于團(tuán)隊(duì)開發(fā)和維護(hù)：在團(tuán)隊(duì)中大家都遵循同一個(gè)標(biāo)準(zhǔn)，可以減少很多差異化的東西命贴，方便開發(fā)和維 護(hù)道宅，提高開發(fā)效率，甚至實(shí)現(xiàn)模塊化開發(fā)套么。
3.怎樣理解內(nèi)容與樣式分離的原則培己？
在前端中，Html指的是結(jié)構(gòu)層胚泌；CSS指的是樣式層省咨；JavaScript指的是行為層。
寫 HTML 的時(shí)候先不管樣式, 重點(diǎn)放在HTML的結(jié)構(gòu)和語義化上玷室，讓 HTML 能體現(xiàn)頁面結(jié)構(gòu)或者內(nèi)容之后再去寫樣式零蓉。
HTML 內(nèi)不允許出現(xiàn)屬性樣式，盡量不要出現(xiàn)行內(nèi)樣式穷缤。
寫 JS 的時(shí)候敌蜂，盡量不要用 JS 去直接操作樣式，而是通過給元素添加刪除class來控制樣式變化津肛。
4.有哪些常見的meta標(biāo)簽?
| 標(biāo)簽 | 含義 |
|---|---|
| <mata charset="utf-8"> | 聲明文檔使用的字符編碼 |
| <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/> | 聲明文檔兼容模式章喉，指示IE以 目前 可用的最高模式顯示內(nèi)容 |
| <meta name="keywords" content="your tags"> | 定義針對搜索引擎的關(guān)鍵詞 |
| <meta name="description" content="不超過850個(gè)字符"> | 頁面描述身坐，告訴搜索引擎你的站點(diǎn)的主要內(nèi) 容 |
| <meta name="author" content="你的姓名"> | 定義網(wǎng)頁作者 |
| <meta name="revised" content="David, 2008/8/8/" /> | 定義頁面的最新版本 |
| <meta http-equiv="refresh" content="5"/> | 5秒刷新一次頁面 |
| <meta http-equiv="expires" content="Mon,12 May 2001 00:20:00 GMT"> | 用于設(shè)定網(wǎng)頁的到期時(shí)間，一旦過期則必須到服務(wù)器上重新調(diào)用部蛇。需要注意的是必須使用GMT時(shí)間格式 |
| <meta http-equiv="pragma" content="no-cache"> | 禁用緩存 |
| <meta http-equiv="set-cookie" content="Mon, 12 May 2001 00:20:00 GMT"> | cookie設(shè)定，如果網(wǎng)頁過 期涯鲁，存盤的cookie將被刪除有序。需要注意的也必須使用GMT時(shí)間格式。 |
| <meta name="robots" content="index,follow" /> | 搜索引擎索引方式 |
5.文檔聲明的作用?嚴(yán)格模式和混雜模式指什么?<!doctype html>
- <!DICTYPE>聲明位于文檔中的最前面岛请，處于<html>標(biāo)簽之前旭寿，告訴瀏覽器的解析器，用什么文檔類型來規(guī)范解析這個(gè)文檔髓需。
- 嚴(yán)格模式的排版和js運(yùn)作模式是以該瀏覽器支持的最高標(biāo)準(zhǔn)運(yùn)行
- 在混雜模式中许师，頁面以寬松的向后兼容的方式顯示房蝉，模擬老式瀏覽器的行為以防止站點(diǎn)無法工作
DOCTYPE不存在 或格式不正確會導(dǎo)致文檔以混雜模式呈現(xiàn)
6.瀏覽器亂碼的原因是什么僚匆？如何解決
設(shè)置<meta charset>標(biāo)簽聲明文檔使用的字符編碼
設(shè)置正確的字符編碼
設(shè)置瀏覽器顯示正確的編碼
如果瀏覽器瀏覽時(shí)候出現(xiàn)網(wǎng)頁亂碼，在瀏覽器中找到轉(zhuǎn)換編碼的菜單調(diào)整搭幻。IE9瀏覽器：在需要轉(zhuǎn)碼的網(wǎng)頁空白出右鍵鼠標(biāo)咧擂，選擇“編碼”。傲游瀏覽器：在需要轉(zhuǎn)碼的網(wǎng)頁時(shí)檀蹋，菜單“查看”-->“編碼”即可選擇轉(zhuǎn)換編碼谷歌瀏覽器：在需要轉(zhuǎn)碼的網(wǎng)頁時(shí)松申，點(diǎn)擊右上角“三橫”圖標(biāo)選擇“工具”-->“編碼”即可選擇切換網(wǎng)頁編碼
7.常見的瀏覽器有哪些，什么內(nèi)核?
| 瀏覽器 | 內(nèi)核 |
|---|---|
| IE | Trident又稱IE內(nèi)核 |
| Firefox | Gecko |
| Opear | Presto |
| Safari | Webkit |
| chrome | Webkit |
8.列出常見的標(biāo)簽俯逾，并簡單介紹這些標(biāo)簽用在什么場景
| 標(biāo)簽 | 場景 |
|---|---|
| html | 將所有HTML內(nèi)容都包含在這個(gè)標(biāo)簽內(nèi) |
| head | 用于定義文檔的頭部贸桶，它是所有頭部元素的容器 |
| title | 文檔的標(biāo)題 |
| meta | 提供有關(guān)頁面的元信息 |
| body | 文檔的內(nèi)容 |
| h1-h6 | h1h6分別對應(yīng)六級標(biāo)題，從16標(biāo)題一次減小 |
| p | 段落標(biāo)簽 |
| a | 定義錨桌肴，即在頁面插入鏈接 |
| img | 圖片 |
| ul | 無序列表 |
| ol | 有序列表 |
| li | 列表項(xiàng) |
| div | 定義文檔中的節(jié)皇筛，默認(rèn)表現(xiàn)為塊元素 |
| span | 定義定義文檔中的節(jié)，默認(rèn)表現(xiàn)為行內(nèi)元素 |
| em | 定義強(qiáng)調(diào)文本 |
| br | 換行 |
| i | 定義斜體字 |
| strong | 定義強(qiáng)調(diào)文本 |
| q | 定義短引用 |
