HTML、XML颤枪、XHTML 有什么區(qū)別
- HTML汗捡，超文本標(biāo)記語言，是語法較為松散的汇鞭、不嚴(yán)格的Web語言凉唐；
- XML庸追，可擴(kuò)展標(biāo)記語言，主要用于存儲(chǔ)數(shù)據(jù)和結(jié)構(gòu)參考台囱；
- XHTML淡溯，可擴(kuò)展超文本標(biāo)記語言，基于XML簿训，作用與HTML類似咱娶，但語法更嚴(yán)格參考。
怎樣理解 HTML 語義化
HTML語義化是什么
- html語義化是一種編寫HTML的方式强品，選擇合適的標(biāo)簽膘侮、使用合理的代碼結(jié)構(gòu)，便于開發(fā)者閱讀的榛，同時(shí)讓瀏覽器的爬蟲和機(jī)器很好地解析琼了。
為什么要語義化HTML
- 提高用戶體驗(yàn)，比如：title夫晌，alt用于解釋名詞和圖片信息雕薪；
- 利于SEO，語義化能和搜索引擎建立良好的聯(lián)系晓淀，有利于爬蟲抓取更多的有效信息所袁。爬蟲依賴于標(biāo)簽來確定上下文和各個(gè)關(guān)鍵字的權(quán)重；
- 方便其他設(shè)備解析（如屏幕閱讀器凶掰、盲人閱讀器燥爷、移動(dòng)設(shè)備）以語義的方式來渲染網(wǎng)頁；
- 便于團(tuán)隊(duì)開發(fā)和維護(hù)懦窘，語義化更具可讀性前翎，如果遵循W3C標(biāo)準(zhǔn)的團(tuán)隊(duì)都遵循這個(gè)標(biāo)準(zhǔn)，可以減少差異化奶赠，利于規(guī)范化鱼填。
如何實(shí)現(xiàn)HTML語義化
- 盡可能少的使用沒有語義的div和span元素药有；
- 不要使用純樣式標(biāo)簽毅戈，如：b、font愤惰、u等苇经，改用css設(shè)置；
- 需要強(qiáng)調(diào)的文本宦言，可以包含在strong或者em標(biāo)簽中（瀏覽器預(yù)設(shè)樣式扇单，能用CSS指定就不用他們），strong默認(rèn)樣式是加粗（不要用b奠旺，因?yàn)闆]語義）蜘澜，em是斜體（不用i同b）施流；
- 不要使用table標(biāo)簽進(jìn)行頁面布局。
怎樣理解內(nèi)容與樣式分離的原則
什么叫做內(nèi)容與樣式分離的原則
- 一個(gè)網(wǎng)頁可以簡單的分為三個(gè)部分：HTML——結(jié)構(gòu)鄙信，CSS——表現(xiàn)瞪醋，JavaScrip——行為。內(nèi)容和樣式的分離装诡，就是指在網(wǎng)頁編碼的過程中银受，要將HTML和CSS兩大部分分開。
為什么要遵守內(nèi)容與樣式分離原則
- 瀏覽器加載網(wǎng)頁頁面速度變快鸦采。分離原則下宾巍，大部分頁面代碼寫在了CSS當(dāng)中，頁面體積容量變得更小渔伯。
- 網(wǎng)頁修改設(shè)計(jì)時(shí)顶霞，效率、省時(shí)锣吼。根據(jù)html標(biāo)簽內(nèi)ID或class的標(biāo)記确丢，到CSS里找到相應(yīng)的ID或class，可以快速替換指定位置的樣式吐限，不會(huì)破壞頁面架構(gòu)和其他部分的樣式鲜侥。典型的應(yīng)用就是網(wǎng)頁換膚，使用相同的 html 結(jié)構(gòu)诸典，不同的 css 樣式描函。
- 更好地被搜索引擎收錄『唬基于內(nèi)容與樣式分離的原則舀寓，html的語義化就是首要考慮的,網(wǎng)頁中語義化的標(biāo)簽代碼就會(huì)更加適合搜索引擎。
- css樣式的分離肌蜻，它可以根據(jù)不同的瀏覽器互墓，達(dá)到顯示效果的統(tǒng)一。保證網(wǎng)頁架構(gòu)不變形的前提下蒋搜，放心在不同瀏覽器渲染顯示樣式篡撵。
如何實(shí)現(xiàn)內(nèi)容與樣式分離
- 寫 HTML 的時(shí)候先不管樣式, 重點(diǎn)放在HTML的結(jié)構(gòu)和語義化上，讓 HTML 能體現(xiàn)頁面結(jié)構(gòu)或者內(nèi)容豆挽。之后再去寫樣式育谬；
- 寫 JS 的時(shí)候，盡量不要用 JS 去直接操作樣式帮哈，而是通過給元素添加刪除class來控制樣式變化膛檀；
- HTML 內(nèi)不允許出現(xiàn)屬性樣式，盡量不要出現(xiàn)行內(nèi)樣式。
有哪些常見的meta標(biāo)簽
- 聲明文檔所使用的文字編碼
<meta charset='utf-8' /> - 頁面關(guān)鍵詞
<meta name="keywords" content="前端 饑人谷"> - 便于在移動(dòng)設(shè)備瀏覽器測試及瀏覽
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> - 聲明文檔兼容模式
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> - 搜索引擎根據(jù)這個(gè)描述進(jìn)行收錄排名
<meta name="description" content="最有愛的前端學(xué)習(xí)社區(qū)">
文檔聲明的作用?嚴(yán)格模式和混雜模式指什么? < !doctype html> 的作用?
- 文檔聲明的作用是告知瀏覽器頁面使用的HTML版本咖刃；通俗的講就是要告訴瀏覽器泳炉，你的 HTML 文檔是用的什么版本的 HTML 來寫的，這樣瀏覽器才能按照你聲明的版本來正確的解析你的 HTML 文檔嚎杨。
- 嚴(yán)格模式也叫做標(biāo)準(zhǔn)模式胡桃，是指瀏覽器按 W3C 標(biāo)準(zhǔn)解析執(zhí)行代碼；
- 混雜模式則是使用瀏覽器自己的方式解析執(zhí)行代碼磕潮，因?yàn)椴煌瑸g覽器解析執(zhí)行的方式不一樣翠胰，這樣做就是為了兼容在W3C標(biāo)準(zhǔn)出現(xiàn)之前就存在的那些“不標(biāo)準(zhǔn)”的頁面。
-<!doctype html> 聲明位于文檔中的最前面的位置自脯，處于 <html> 標(biāo)簽之前之景。此標(biāo)簽可告知瀏覽器使用最新的HTML 5標(biāo)準(zhǔn)來解析渲染頁面。
瀏覽器亂碼的原因是什么膏潮？如何解決
- 瀏覽器亂碼產(chǎn)生的原因
- 亂碼產(chǎn)生的根本原因是你保存的編碼格式和瀏覽器解析時(shí)的解碼格式不匹配導(dǎo)致的锻狗。
- 亂碼一般是英文以外的字符才會(huì)出現(xiàn)。
- 如何解決
首先焕参，在文件保存的時(shí)候你自己要清楚是用哪種編碼方式保存的轻纪。如果你的文件是保存為utf-8格式，那么一定要在html 的<head>里添加<meta charset="utf-8">叠纷，這句話的意思是告訴瀏覽器在打開這個(gè)頁面的時(shí)候不要去猜了刻帚，直接用utf-8去解碼。 同理涩嚣，如果你的文件保存為gbk格式崇众，一定在文件里添加<meta charset="gbk">。
常見的瀏覽器有哪些航厚，什么內(nèi)核
| 瀏覽器 | 內(nèi)核 |
|---|---|
| IE顷歌、Maxthon、TT幔睬、The World等 | Trident |
| Netcape6及以上版本眯漩、FireFox | Gecko |
| Opera7及以上版本 | Presto |
| Safari、Chrome | Webkit |
列出常見的標(biāo)簽麻顶，并簡單介紹這些標(biāo)簽用在什么場景
| 常見標(biāo)簽 | 應(yīng)用 |
|---|---|
| <head> | 頭部赦抖，head標(biāo)簽是頁面的“頭部”， 一般來說澈蚌，只有6個(gè)標(biāo)簽?zāi)芊旁?lt;head>標(biāo)簽內(nèi)：<title>摹芙、<meta>灼狰、<link>宛瞄、<style>、<script>、<base> |
| <body> | html 頁面主體 |
| <h1>~<h6> | 標(biāo)題 |
| <p> | 段落文字 |
| <a> | 設(shè)置鏈接 |
| <img> | 圖片 |
| <ol><ul><li> | 有序列表和無序列表 |
| <table><tr><td><th> | 表格 |
| <inframe> | 創(chuàng)建包含另外一個(gè)文檔的內(nèi)聯(lián)框架 |
| <dl><dt><dd> | 描述標(biāo)題內(nèi)容 |
