一、什么是HTML夕晓？
HTML是用來(lái)描述網(wǎng)頁(yè)的一種語(yǔ)言
- HTML指的是超文本標(biāo)記語(yǔ)言（Hyper Text Markup Language）
- HTML不是一種編程語(yǔ)言，而是一種標(biāo)記語(yǔ)言（markup language）
- 標(biāo)記語(yǔ)言是一套標(biāo)記標(biāo)簽（markup tag）
- HTML使用標(biāo)記標(biāo)簽來(lái)描述網(wǎng)頁(yè)
重點(diǎn)：HTML是一種標(biāo)記語(yǔ)言（超文本標(biāo)記語(yǔ)言）而非編程語(yǔ)言
二、HTML、XML窿撬、XHTML之間的區(qū)別
- HTML：超文本標(biāo)記語(yǔ)言，語(yǔ)法松散叙凡、不嚴(yán)格的標(biāo)記語(yǔ)言
- XML：可擴(kuò)展標(biāo)記語(yǔ)言劈伴，主要用于存儲(chǔ)數(shù)據(jù)和結(jié)構(gòu)
- XHTML：可擴(kuò)展超文本標(biāo)記語(yǔ)言，基于XML握爷，作用與HTML類似跛璧，語(yǔ)法更嚴(yán)謹(jǐn)更純凈的HTML版本
HTML與XHTML最主要的不同：
- XHTML 元素必須被正確地嵌套
- XHTML 元素必須被關(guān)閉
- 標(biāo)簽名必須使用小寫(xiě)字母
- XHTML 文檔必須擁有根元素
三、HTML語(yǔ)義化
1. 什么是語(yǔ)義化
語(yǔ)義化是指根據(jù)內(nèi)容的結(jié)構(gòu)化（內(nèi)容語(yǔ)義化）饼拍，選擇合適的標(biāo)簽（標(biāo)簽語(yǔ)義化）赡模，便于開(kāi)發(fā)者閱讀和寫(xiě)出更規(guī)范的代碼的同時(shí)，讓瀏覽器的爬蟲(chóng)和機(jī)器更好的解析师抄。
2. 為什么要語(yǔ)義化漓柑？
有利于SEO
和搜索引擎建立良好的溝通，有助于爬蟲(chóng)抓取更多的有效信息，爬蟲(chóng)是依賴于標(biāo)簽來(lái)確定上下文和各個(gè)關(guān)鍵字的權(quán)重清晰的頁(yè)面結(jié)構(gòu)
語(yǔ)義化的HTML在沒(méi)有CSS的情況下也能呈現(xiàn)較好的內(nèi)容結(jié)構(gòu)和代碼結(jié)構(gòu)辆布，增強(qiáng)頁(yè)面的可讀性便于團(tuán)隊(duì)開(kāi)發(fā)和維護(hù)
在團(tuán)隊(duì)中大家遵循同一個(gè)標(biāo)準(zhǔn)瞬矩，使用規(guī)范的代碼，方便開(kāi)發(fā)和維護(hù)锋玲，提高開(kāi)發(fā)效率方便其他設(shè)備的解析
四景用、怎樣理解內(nèi)容與樣式分離的原則
-
HTML——結(jié)構(gòu)
寫(xiě)HTML的時(shí)候先不管樣式，重點(diǎn)放在HTML的結(jié)構(gòu)和語(yǔ)義化上惭蹂，讓HTML能體現(xiàn)頁(yè)面結(jié)構(gòu)和內(nèi)容 -
CSS——表現(xiàn)
寫(xiě)完HTML的結(jié)構(gòu)和內(nèi)容后伞插，再進(jìn)行CSS樣式的編寫(xiě)，減少HTML與CSS契合度（即內(nèi)容與樣式分離） -
JavaScrip——行為
寫(xiě)JS的時(shí)候盾碗，盡量不要用JS去直接操作樣式媚污，而是通過(guò)給元素添加刪除class來(lái)控制樣式變化（即行為分離）
樣式與結(jié)構(gòu)分離的優(yōu)點(diǎn)：
- 瀏覽器加載網(wǎng)頁(yè)頁(yè)面速度變快。分離原則下廷雅，頁(yè)面樣式的代碼寫(xiě)在了CSS當(dāng)中耗美，頁(yè)面體積容量變得更小
- 修改網(wǎng)頁(yè)樣式時(shí)，更有效率航缀、更省時(shí)間商架。根據(jù)html標(biāo)簽內(nèi)ID或class的標(biāo)記，到CSS里找到相應(yīng)的ID或class芥玉，可以快速替換指定位置的樣式蛇摸，不會(huì)破壞頁(yè)面架構(gòu)和其他部分的樣式
- 可以確保網(wǎng)頁(yè)都能平穩(wěn)退化。具備CSS支持的瀏覽器固然可以把網(wǎng)頁(yè)呈現(xiàn)的美輪美奐飞傀，不支持或禁用了CSS功能的瀏覽器同樣可以把網(wǎng)頁(yè)的內(nèi)容按照正確的內(nèi)容結(jié)構(gòu)顯示出來(lái)
五皇型、有哪些常見(jiàn)的meta標(biāo)簽
1. meta標(biāo)簽定義和用法
- <meta>元素可提供有關(guān)頁(yè)面的元信息（meta-information），比如針對(duì)搜索引擎和更新頻度的描述和關(guān)鍵詞
- <meta>標(biāo)簽位于文檔的頭部砸烦，不包含任何內(nèi)容弃鸦；<meta>標(biāo)簽的屬性定義了與文檔相關(guān)聯(lián)的名稱/值對(duì)
2. 常見(jiàn)meta標(biāo)簽用法
<meta charset="utf-8">
編碼方式
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
雙核瀏覽器
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
用于移動(dòng)端的展示合理
<meta name="keywords" content="前端 饑人谷">
網(wǎng)頁(yè)關(guān)鍵字，利于搜索
<meta name="description" content="最有愛(ài)的前端學(xué)習(xí)社區(qū)">
搜索引擎優(yōu)化
<meta name="keywords" content="">
向搜索引擎說(shuō)明你的網(wǎng)頁(yè)的關(guān)鍵詞
<meta name="description" content="">
告訴搜索引擎你的站點(diǎn)的主要內(nèi)容
<meta name="author" content="你的姓名">
告訴搜索引擎你的站點(diǎn)的制作的作者
<meta http-equiv="Content-Type" content="text/html";charset=utf-8">
指定字符集
<meta http-equiv="refresh" content="n;url=">
定時(shí)讓網(wǎng)頁(yè)在指定的時(shí)間n內(nèi)跳轉(zhuǎn)
<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)頁(yè)過(guò)期唬格，存盤(pán)的cookie將被刪除。需要注意的也是必須使用GMT時(shí)間格式
六颜说、文檔聲明的作用?嚴(yán)格模式和混雜模式指什么?<!doctype html> 的作用?
1. Doctype作用是什么购岗？
- <!DOCTYPE>聲明叫做文件類型定義（DTD）,聲明的作用是為了告訴瀏覽器該文件的類型。讓瀏覽器解析器知道應(yīng)該用哪個(gè)規(guī)范來(lái)解析文檔门粪。
- <!DOCTYPE>聲明必須在HTML文檔的第一行喊积，這并不是一個(gè)HTML標(biāo)簽。
2. 嚴(yán)格模式與混雜模式如何區(qū)分玄妈？它們有何意義乾吻？
嚴(yán)格模式：又稱標(biāo)準(zhǔn)模式髓梅，是指瀏覽器按照W3C標(biāo)準(zhǔn)解析代碼
混雜模式：又稱怪異模式或兼容模式，是指瀏覽器用自己的方式解析代碼
如何區(qū)分：瀏覽器解析時(shí)到底使用嚴(yán)格模式還是混雜模式绎签，與網(wǎng)頁(yè)中的DTD直接相關(guān)
- 如果文檔包含嚴(yán)格的 DOCTYPE 枯饿，那么它一般以嚴(yán)格模式呈現(xiàn)。**（嚴(yán)格 DTD ——嚴(yán)格模式） **
- 包含過(guò)渡 DTD 和 URI 的 DOCTYPE 诡必，也以嚴(yán)格模式呈現(xiàn)奢方，但有過(guò)渡 DTD 而沒(méi)有 URI （統(tǒng)一資源標(biāo)識(shí)符，就是聲明最后的地址）會(huì)導(dǎo)致頁(yè)面以混雜模式呈現(xiàn)爸舒。**（有 URI 的過(guò)渡 DTD ——嚴(yán)格模式蟋字；沒(méi)有 URI 的過(guò)渡 DTD ——混雜模式） **
- DOCTYPE 不存在或形式不正確會(huì)導(dǎo)致文檔以混雜模式呈現(xiàn)。（DTD不存在或者格式不正確——混雜模式）
- HTML5 沒(méi)有 DTD 碳抄，因此也就沒(méi)有嚴(yán)格模式與混雜模式的區(qū)別愉老，HTML5 有相對(duì)寬松的語(yǔ)法，實(shí)現(xiàn)時(shí)剖效，已經(jīng)盡可能大的實(shí)現(xiàn)了向后兼容。（ HTML5 沒(méi)有嚴(yán)格和混雜之分）
意義：嚴(yán)格模式與混雜模式存在的意義與其來(lái)源密切相關(guān)焰盗，如果說(shuō)只存在嚴(yán)格模式，那么許多舊網(wǎng)站必然受到影響，如果只存在混雜模式买羞，那么會(huì)回到當(dāng)時(shí)瀏覽器大戰(zhàn)時(shí)的混亂峻贮，每個(gè)瀏覽器都有自己的解析模式。
七澎粟、瀏覽器亂碼的原因是什么蛀序？
1. 通用編碼方式
- ASCII，全稱美國(guó)標(biāo)準(zhǔn)信息交換代碼（American Standard Code for Information Interchange）的縮寫(xiě), 針對(duì)英語(yǔ)設(shè)計(jì)
- UTF-8（8-bit Unicode Transformation Format）是一種針對(duì)Unicode的可變長(zhǎng)度字符編碼活烙，又稱萬(wàn)國(guó)碼徐裸。可用于顯示中文簡(jiǎn)體繁體及其它語(yǔ)言（如英文啸盏，日文重贺，韓文）
- GBK，中國(guó)制定的一套漢字編碼規(guī)則回懦，用2個(gè)字節(jié)來(lái)表示一個(gè)漢字气笙，總共可以覆蓋2萬(wàn)多個(gè)文字
- ISOLatin-1，由于ASCII字符集不包括德怯晕、法語(yǔ)中的特殊拉丁字符潜圃，因此歐洲人發(fā)明了ISO 8859-1Latin 1，簡(jiǎn)稱為ISOLatin-1舟茶。它對(duì)ASCII做了個(gè)擴(kuò)充谭期，涵蓋拉丁字母表中特殊語(yǔ)言字符
2. 瀏覽器亂碼的原因
亂碼產(chǎn)生的根本原因是所保存的編碼格式和瀏覽器解析時(shí)的解碼格式不匹配導(dǎo)致的
注：純粹的英文即時(shí)編碼方式和解碼方式不一致也不會(huì)出現(xiàn)亂碼問(wèn)題蛉谜，那是因?yàn)?strong>UTF-8、GBK對(duì)英文都是采用1個(gè)字節(jié)的編碼方式崇堵，并且使用了相同的碼子
3. 如何解決瀏覽器亂碼
- 首先型诚，在文件保存的時(shí)候要清楚是用哪種編碼方式保存的。
- 如果你的文件是保存為UTF-8格式鸳劳，那么一定要在html 的
<head>里添加<meta charset="utf-8">（這句話的意思是告訴瀏覽器在打開(kāi)這個(gè)頁(yè)面的時(shí)候不要去猜了狰贯，直接用utf-8去解碼） - 同理，如果你的文件保存為gbk格式赏廓，一定在文件里添加
<meta charset="gbk">即可
八涵紊、常見(jiàn)的瀏覽器有哪些，什么內(nèi)核
| 瀏覽器 | 內(nèi)核 |
|---|---|
 |
Trident |
 |
Gecko |
 |
Webkit |
 |
Webkit |
 |
Presto |
九幔摸、HTML常用標(biāo)簽
| 標(biāo)簽名字 | 標(biāo)簽作用 | 備注 |
|---|---|---|
<h1-h6> |
標(biāo)題標(biāo)簽 | <h1>標(biāo)題</h1> |
<p> |
段落標(biāo)簽摸柄，文本內(nèi)容 | <p>段落</p> |
<a> |
定義一個(gè)超鏈接 | <a >百度</a> |
<img> |
定義圖像 |  |
<div> |
定義文檔中的分區(qū) | <div>文檔中分區(qū)</div> |
<button> |
定義按鈕 | <button>點(diǎn)我</button |
<iframe> |
用于嵌入一個(gè)頁(yè)面 | <iframe src="https://jirengu.com/" name="myPage"></iframe> |
<ol> <li>
|
定義有序列表 | |
<ul> <li>
|
定義無(wú)序列表 | |
<dl> <dt> <dd>
|
自定義列表 | |
<table> <tr> <th>
|
定義表格 |
