HTML、XML、XHTML有什么區(qū)別？
HTML （HyperText Markup Language）超文本標(biāo)記語(yǔ)。，主要用來(lái)顯示數(shù)據(jù)。對(duì) 語(yǔ)法要求不嚴(yán)格，瀏覽器會(huì)盡力去解析其代碼，盡管代碼不規(guī)范。
XML（EXtensible Markup Language）可擴(kuò)展標(biāo)記語(yǔ)言。目的是為了傳輸和存儲(chǔ)數(shù)據(jù)，其焦點(diǎn)是數(shù)據(jù)的內(nèi)容，標(biāo)簽沒(méi)有被預(yù)定義，需要自行定義標(biāo)簽。
XHTML（Extensible HyperText Markup Language）可擴(kuò)展超文本標(biāo)記語(yǔ)言。是HTML 與XML的結(jié)合物，更嚴(yán)格更純凈的 HTML。
怎樣理解 HTML 語(yǔ)義化？
HTML語(yǔ)義化是指使用合適的標(biāo)簽來(lái)體現(xiàn)HTML文檔的結(jié)構(gòu)，根據(jù)內(nèi)容的結(jié)構(gòu)、用途來(lái)選擇適當(dāng)?shù)臉?biāo)簽，避免用標(biāo)簽來(lái)指定樣式。
語(yǔ)義化后的標(biāo)簽有一下優(yōu)勢(shì)：
- 在沒(méi)有CSS的情況下，頁(yè)面也能呈現(xiàn)出很好地內(nèi)容結(jié)構(gòu)、代碼結(jié)構(gòu)。
- 有利于SEO：和搜索引擎建立良好溝通，有助于爬蟲(chóng)抓取更多的有效信息。
- 便于團(tuán)隊(duì)開(kāi)發(fā)和維護(hù)，語(yǔ)義化的HTML可以讓開(kāi)發(fā)者更容易的看明白，從而提高團(tuán)隊(duì)的效率和協(xié)調(diào)能力。
- 用戶體驗(yàn)：例如title、alt用于解釋名詞或解釋圖片信息、label標(biāo)簽的活用。
- 能夠適應(yīng)各種各樣的設(shè)備。
怎樣理解內(nèi)容與樣式分離的原則？
內(nèi)容與樣式分離就是網(wǎng)頁(yè)的內(nèi)容和結(jié)構(gòu)由HTML負(fù)責(zé)，而由CSS來(lái)負(fù)責(zé)樣式。分離后，內(nèi)容和樣式更加清晰，之后修改更加方便，便于團(tuán)隊(duì)的開(kāi)發(fā)和維護(hù)。
有哪些常見(jiàn)的meta標(biāo)簽？
參考HTML meta標(biāo)簽總結(jié)與屬性使用介紹
常用meta整理
<meta>標(biāo)簽提供關(guān)于HTML文檔的元數(shù)據(jù)。元數(shù)據(jù)不會(huì)顯示在頁(yè)面上，但是對(duì)于機(jī)器是可讀的。它可用于瀏覽器（如何顯示內(nèi)容或重新加載頁(yè)面），搜索引擎（關(guān)鍵詞），或其他 web 服務(wù)。
必要屬性
| 屬性 | 值 | 描述 |
|---|---|---|
| content | some text | 定義與http-equiv或name屬性相關(guān)的元信息 |
可選屬性
| 屬性 | 值 | 描述 |
|---|---|---|
| http-equiv | content-type / expire / refresh / set-cookie | 把content屬性關(guān)聯(lián)到HTTP頭部。 |
| name | author / description / keywords / generator / revised / others | 把 content 屬性關(guān)聯(lián)到一個(gè)名稱。 |
| content | some text | 定義用于翻譯 content 屬性值的格式。 |
-
<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="X-UA-Compatible" content="IE=edge,chrome=1"/>指定IE和Chrome使用最新版本渲染當(dāng)前頁(yè)面 <meta name="robots" content="index,follow" />- all：文件將被檢索，且頁(yè)面上的鏈接可以被查詢；
- none：文件將不被檢索，且頁(yè)面上的鏈接不可以被查詢；
- index：文件將被檢索；
- follow：頁(yè)面上的鏈接可以被查詢；
- noindex：文件將不被檢索；
- nofollow：頁(yè)面上的鏈接不可以被查詢。
- 移動(dòng)設(shè)備
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no"/>
width：寬度（數(shù)值 / device-width）（范圍從200 到10,000，默認(rèn)為980 像素）
height：高度（數(shù)值 / device-height）（范圍從223 到10,000）
initial-scale：初始的縮放比例 （范圍從>0 到10）
minimum-scale：允許用戶縮放到的最小比例
maximum-scale：允許用戶縮放到的最大比例
user-scalable：用戶是否可以手動(dòng)縮 (no,yes)
文檔聲明的作用?嚴(yán)格模式和混雜模式指什么?<!doctype html> 的作用?
- <!DOCTYPE>聲明叫做文件類型定義（DTD），聲明的作用為了告訴瀏覽器該文件的類型。讓瀏覽器解析器知道應(yīng)該用哪個(gè)規(guī)范來(lái)解析文檔。<!DOCTYPE>聲明必須在 HTML 文檔的第一行，這并不是一個(gè) HTML 標(biāo)簽。
- 嚴(yán)格模式：又稱標(biāo)準(zhǔn)模式，是指瀏覽器按照 W3C 標(biāo)準(zhǔn)解析代碼。
混雜模式：又稱怪異模式或兼容模式，是指瀏覽器用自己的方式解析代碼。 - <!DOCTYPE html>告訴瀏覽器以html5的規(guī)范來(lái)解析該文檔。
瀏覽器亂碼的原因是什么？如何解決？
參考字符編碼
瀏覽器亂碼的原因是并不知道應(yīng)該采取何種方式進(jìn)行解碼，也就是說(shuō)并不清楚該文檔的編碼類型。
可以在meta標(biāo)簽中用charset指定頁(yè)面的編碼方式，現(xiàn)在一般用UTF-8，支持多種語(yǔ)言。
常見(jiàn)的瀏覽器有哪些，什么內(nèi)核?
| 瀏覽器 | 內(nèi)核 | css實(shí)現(xiàn)兼容 |
|---|---|---|
| Chrome和Android瀏覽器 | WebKit | -webkit |
| Safari | WebKit | -webkit |
| IE | Trident | -ms |
| Firefox | Gecko | -moz |
| Opera | Presto | -o |
列出常見(jiàn)的標(biāo)簽，并簡(jiǎn)單介紹這些標(biāo)簽用在什么場(chǎng)景
| 標(biāo)簽 | 語(yǔ)義 |
|---|---|
<h1>~<h6>
|
標(biāo)題 |
<a>、<p>、<img>、<button>
|
超鏈接、段落、圖片、按鈕 |
<table>、<tr>、<th>、<td>
|
表格、表格中一行、表格頭部單元格、表格內(nèi)容單元格 |
<ul>、<ol>、<li>
|
有序列表、無(wú)序例表、列表項(xiàng) |
<dl>、<dt>、<dd>
|
定義列表、定義標(biāo)題、定義內(nèi)容 |
<em>``<strong> |
都是強(qiáng)調(diào)，<strong>程度高 |
<div>、<span>
|
用作劃分布局等，div為塊，span為行內(nèi)元素 |
<q>、<blockquote>
|
短引用、塊引用 |
<iframe>用法
<iframe src="http://baidu.com" name="myPage"></iframe>
<p><a target="myPage">W3Cschool.cc</a></p>
可以用來(lái)嵌入一個(gè)頁(yè)面，注意<a>標(biāo)簽中target屬性與<iframe>中name屬性的關(guān)系。注意跨域操作問(wèn)題。
