1. 新的HTML5文檔類型和字符集是逻翁？
HTML5文檔類型：<!DOCUTYPE HTML>;
字符集：UTF-8;
2. HTML5中如何嵌入音頻舌劳？
<audio autoplay ="autoplay" controls="controls" loop="loop" src="url"> 您的瀏覽器不支持 audio 標(biāo)簽 </audio>
3.HTML5中如何嵌入視頻驹溃？
<vedio src="movie.ogg" controls = "controls" height="500" width="500" ></vedio>
4.除了audio 和vedio隶垮，HTML5還有哪些媒體標(biāo)簽公般？
多媒體交互標(biāo)簽
<vedio> 定義一個(gè)視頻
<audio> 定義一個(gè)音頻
<source> 定義媒體資源
<canvas> 定義圖片
<embed> 定義外部的可交互的內(nèi)容或插件 比如flash
擴(kuò)展
結(jié)構(gòu)標(biāo)簽：（塊狀元素）有意義的div
<article> 定義一篇文章
<header> 定義一個(gè)頁(yè)面或一個(gè)區(qū)域的頭部
<nav> 定義導(dǎo)航鏈接
<section> 定義一個(gè)區(qū)域
<aside> 定義頁(yè)面內(nèi)容部分的側(cè)邊欄
<hgroup> 定義文件中一個(gè)區(qū)塊的相關(guān)信息
<figure> 定義一組媒體內(nèi)容
<figcaption>定義figure元素的標(biāo)題
<footer>定義一個(gè)頁(yè)面或一個(gè)區(qū)域的底部
<dialog>定義一個(gè)對(duì)話框（會(huì)話框）類似微信
web應(yīng)用標(biāo)簽
<menu>命令列表
<menuitem>menu命令列表標(biāo)簽FF(嵌入系統(tǒng))
<command>menu標(biāo)記定義一個(gè)命令按鈕
<meter> 狀態(tài)標(biāo)簽（實(shí)時(shí)狀態(tài)顯示：氣壓、氣溫）C仰坦、O
<progress> 狀態(tài)標(biāo)簽（任務(wù)過(guò)程：安裝、加載） C计雌、F悄晃、O
<datalist>為input標(biāo)記定義一個(gè)下拉列表，配合option凿滤，F(xiàn)妈橄、O
<details>定義一個(gè)元素的詳細(xì)內(nèi)容，配合dt翁脆、dd C
注釋標(biāo)簽
<ruby>定義注釋或音標(biāo)
<rp>告訴那些不支持Ruby元素的瀏覽器如何去顯示
<rt>定義對(duì)ruby的注釋內(nèi)容文本
其他標(biāo)簽
<keygen>定義表單里一個(gè)生成的鍵值（加密信息傳送）
<mark>定義有標(biāo)記的文本（黃色選中狀態(tài)）
<output>定義一些輸出類型眷蚓，計(jì)算表單結(jié)果配合oninput事件
重新定義的HTML標(biāo)簽
<b>代表內(nèi)聯(lián)文本，通常是粗體反番，沒有傳遞表示重要的意思
<i>代表內(nèi)聯(lián)文本沙热，通常是斜體，沒有傳遞表示重要的意思
<dd>可以同details與figure一同使用罢缸，定義包含文本篙贸，dialog也可用
<dt>可以同details與figure一同使用，匯總細(xì)節(jié)枫疆，dialog也可用
<hr>表示主題結(jié)束歉秫，而不是水平線，雖然顯示相同
<menu>重新定義用戶界面的菜單养铸，配合commond或者menuitem使用
<small>表示小字體，例如打印注釋或者法律條款
<strong>表示重要性而不是強(qiáng)調(diào)符號(hào)
5. HTML5 canvas元素有什么用轧膘？
canvas標(biāo)簽是為了客戶端矢量圖形而設(shè)計(jì)的钞螟。它自己沒有行為，但卻把一個(gè)繪圖API展現(xiàn)給客戶端JavaScript以使腳本能夠把想繪制的東西都繪制到一塊畫布上谎碍，即canvas有一個(gè)基于JavaScript的繪圖API鳞滨，SVG和VML使用一個(gè)XML文檔來(lái)描述繪圖。
6.HTML5存儲(chǔ)類型有什么區(qū)別蟆淀？
HTML5 支持本地存儲(chǔ)拯啦，在之前版本中是通過(guò)cookie實(shí)現(xiàn)的澡匪，HTML5本地存儲(chǔ)速度快而且安全。
有兩種不同的對(duì)象可用來(lái)存儲(chǔ)數(shù)據(jù)：
- localStorage 適用于長(zhǎng)期存儲(chǔ)數(shù)據(jù)褒链，瀏覽器關(guān)閉后數(shù)據(jù)不丟失唁情；
- sessionStorage 存儲(chǔ)的數(shù)據(jù)在瀏覽器關(guān)閉后自動(dòng)刪除；
提供三種方法:getitem(key)甫匹、setitem(key,value)甸鸟、removeitem(key)
7.HTML5有哪些新增加的表單元素？
我們以前學(xué)過(guò)的表單元素包括text兵迅、button抢韭、file、radio等恍箭，HTML5中新增加了一些表單元素刻恭，下面列出這些元素及其作用：
- email類型用于驗(yàn)證email的格式，當(dāng)提交表單會(huì)自動(dòng)驗(yàn)證email域的值
- url類型用于驗(yàn)證url地址的格式扯夭，當(dāng)提交表單時(shí)會(huì)自動(dòng)驗(yàn)證url域的值
- number類型會(huì)根據(jù)你的設(shè)置提供選擇數(shù)字的功能鳍贾，min屬性設(shè)置最小值、max屬性設(shè)置最大值勉抓，value屬性設(shè)置當(dāng)前值贾漏，step屬性設(shè)定每次增長(zhǎng)的值，某些瀏覽器還不支持
- range類型用于應(yīng)該包含一定范圍內(nèi)數(shù)字值的輸入域藕筋，其會(huì)以一個(gè)滑塊的形式展現(xiàn)纵散，min屬性設(shè)置最小值、max屬性設(shè)置最大值隐圾，value屬性設(shè)置當(dāng)前值伍掀，如果沒有設(shè)置，則其默認(rèn)值的范圍是1-100
- 日期和時(shí)間類型：HTML5擁有多個(gè)可供選取日期和時(shí)間的新輸入類型：
date選取日暇藏、月蜜笤、年
month選取月、年
week選取周盐碱、年
time選取時(shí)間（小時(shí)和分鐘）
datetime選取時(shí)間把兔、日、月瓮顽、年（UTC時(shí)間）
datetime-local選取時(shí)間县好、日、月暖混、年（本地時(shí)間） - search類型用于搜索域缕贡，比如站點(diǎn)搜索或google搜索，為其加上results="s"屬性，則會(huì)在搜索框前面加上一個(gè)搜索圖標(biāo)
*tel類型用于驗(yàn)證輸入的是否是電話格式的內(nèi)容晾咪，此元素現(xiàn)在還沒有瀏覽器支持
*color類型會(huì)提供一個(gè)顏色拾取器收擦，供用戶選擇顏色，并將用戶選擇的顏色填充到此元素中
擴(kuò)展
新增加的input屬性
-
autocomplete自動(dòng)顯示以前輸入過(guò)的信息谍倦，取值"on"或者"off"塞赂。 -
autofocus頁(yè)面加載完成后自動(dòng)獲取到焦點(diǎn)。 -
form指定input所屬的form剂跟，可以是多個(gè)减途。 -
formaction指定form提交后處理這個(gè)input的頁(yè)面(URL)或文件。 -
formenctype指定form提交后數(shù)據(jù)如何編碼曹洽。 -
formmethod指定發(fā)送form數(shù)據(jù)的HTTP方法鳍置，會(huì)覆蓋相應(yīng)的form的HTTP方法。 -
formnovalidate提交前不檢查數(shù)據(jù)的有效性送淆。 -
formtarget指定在哪個(gè)地方顯示form提交后response的內(nèi)容税产。 -
height,width輸入框長(zhǎng)和寬，只適用于image類型 -
max,min輸入值的最大值和最小值偷崩，適用于有意義的number辟拷，range，日期類型阐斜。 -
multiple是否允許輸入多個(gè)值衫冻。適用于有意義的number，range谒出，日期類型隅俘。 -
pattern指定驗(yàn)證輸入值的正則表達(dá)式，適用于text笤喳，search为居，url，tel杀狡，email蒙畴，password。 -
required是否是必填項(xiàng)呜象，如果不填必填項(xiàng)膳凝，則表單不能提交。 -
step輸入自動(dòng)增長(zhǎng)時(shí)的步長(zhǎng)值恭陡。 -
list輸入項(xiàng)的候選列表鸠项，需要和datalist元素配合使用，list屬性可用在這些類型上：text,search,url,tel,email,date,number,range和color子姜，目測(cè)在firefox上有效。
8. HTML5廢棄了哪些HTML4標(biāo)簽？
1.能用css代替的元素：basefont,big,center,font,s,strike,tt,u哥捕。
2.不在使用frame框架：frameset,frame,noframes牧抽。
3.只有部分瀏覽器支持的元素：applet,bgsound,blink,marquee。
4.其他被廢除的元素：rb(ruby),acronym(abbr),dir(ul),isindex(form與input相結(jié)合）,listing(pre),xmp(code),nextid(guids),plaintex(text/plian)
9. HTML5標(biāo)準(zhǔn)提供了哪些新的API遥赚？
1.游戲類：canvas扬舒、webgl
2.多媒體：video、audio
3.存儲(chǔ)：localstorage凫佛、sessionstorage讲坎、websql、indexedDB
4.網(wǎng)絡(luò)：websocket
5.拖放API：ondrop,ondragstart,ondragover,draggable:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function allowDrop(ev){
ev.preventDefault();
}
function drag(ev)
{
ev.dataTransfer.setData("Text",ev.target.id);
}
function drop(ev)
{
ev.preventDefault();
var data=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(data));
}
</script>
</head>
<body>
<div id="div1" ondrop="drop(event)"
ondragover="allowDrop(event)"></div>
<img id="drag1" src="img_logo.gif" draggable="true"
ondragstart="drag(event)" width="336" height="69" />
</body>
</html>
10.HTML5應(yīng)用程序緩存和瀏覽器緩存有什么區(qū)別愧薛？
HTML5引入了應(yīng)用緩存技術(shù)晨炕，意味著web應(yīng)用可以進(jìn)行緩存，離線使用毫炉，通過(guò)創(chuàng)建cache manifest文件瓮栗，創(chuàng)建離線應(yīng)用。
應(yīng)用緩存有三個(gè)優(yōu)勢(shì)：
1.離線瀏覽 2.提升頁(yè)面載入速度 3.降低服務(wù)器壓力
離線存儲(chǔ)技術(shù)
HTML5提供了兩大離線存儲(chǔ)技術(shù)：localstorage 和 application cache,兩者各有應(yīng)用場(chǎng)景瞄勾，傳統(tǒng)還有離線存儲(chǔ)技術(shù)cookie费奸。
application cache用于存儲(chǔ)靜態(tài)資源。
cookie只能保存一小段文本（4096字節(jié)）进陡，所以不能存儲(chǔ)大數(shù)據(jù)愿阐，這是cookie與上述緩存技術(shù)的差異之一，因?yàn)镠TTP是無(wú)狀態(tài)的趾疚，服務(wù)器為了區(qū)分請(qǐng)求是否來(lái)源于同一個(gè)服務(wù)器缨历，需要一個(gè)表示字符串，而這個(gè)任務(wù)就是cookie完成的盗蟆，這一段文本每次都會(huì)在服務(wù)器 與瀏覽器之間傳遞戈二，以驗(yàn)證用戶的權(quán)限。
Application Cache使用
1.服務(wù)器端需要維護(hù)一個(gè)manifest清單
2.瀏覽器上只需要一個(gè)簡(jiǎn)單的設(shè)置即可
<html manifest="demo.appcache">
建議application cache 存儲(chǔ)公共資源喳资，不要存儲(chǔ)業(yè)務(wù)資源
瀏覽器緩存是為了節(jié)約網(wǎng)絡(luò)的資源加速瀏覽觉吭，瀏覽器在用戶磁盤上對(duì)最近請(qǐng)求過(guò)的文檔進(jìn)行存儲(chǔ)，當(dāng)訪問(wèn)者再次請(qǐng)求這個(gè)頁(yè)面時(shí)仆邓，瀏覽器可以從本地磁盤顯示文檔鲜滩，這樣就可以加速頁(yè)面的閱覽，人為不可控制节值。
11.Doctype作用徙硅？嚴(yán)格模式與混雜模式如何區(qū)分？他們有何意義搞疗？
<doctype>標(biāo)簽告知瀏覽器文檔使用哪種HTML或者XHTML規(guī)范嗓蘑。
- Doctype可聲明三種DTD類型，分別表示嚴(yán)格版本、過(guò)渡版本以及基于框架的HTML文檔桩皿。
- 標(biāo)準(zhǔn)模式中豌汇，瀏覽器以其支持的最高標(biāo)準(zhǔn)呈現(xiàn)頁(yè)面；
- 在混雜模式中泄隔，頁(yè)面以一種比較寬松的向后兼容的方式顯示拒贱。混雜模式通常模擬老式瀏覽器的行為以防止老站點(diǎn)無(wú)法工作佛嬉。
模式觸發(fā)
瀏覽器根據(jù)DOCTYPE是否存在以及使用的那種DTD來(lái)選擇要使用的呈現(xiàn)方法逻澳。
- 如果XHTML、HTML4.01文檔包含形式完整的DOCTYPE,那么它一般以標(biāo)準(zhǔn)模式呈現(xiàn)暖呕。
- 包含過(guò)渡DTD和URL的DOCUTYPE也導(dǎo)致頁(yè)面以標(biāo)準(zhǔn)模式呈現(xiàn)斜做，但是有過(guò)渡DTD而沒有URL會(huì)導(dǎo)致頁(yè)面以混雜模式呈現(xiàn)。
- DOCTYPE不存在或形式不正確會(huì)導(dǎo)致HTML和XHTML文檔以混雜模式呈現(xiàn)缰揪。
HTML5既然沒有DTD,也就沒有嚴(yán)格模式和寬松模式的區(qū)別陨享，HTML5有相對(duì)寬松的語(yǔ)法，實(shí)現(xiàn)時(shí)钝腺，已經(jīng)盡可能大的實(shí)現(xiàn)了向后兼容抛姑。
12.行內(nèi)元素有哪些？塊級(jí)元素有哪些艳狐？空元素有哪些定硝？
行內(nèi)元素：<span><i><em><strong><b>
塊級(jí)元素：<div><section><article><figure>
空元素：<hr/><br/><img/>
13.link 和@important的區(qū)別是？
- link是XHTML標(biāo)簽毫目，除了加載CSS之外蔬啡，還可以定義RSS等其他事務(wù)，并且無(wú)兼容性問(wèn)題镀虐，而@important屬于CSS范疇箱蟆，只能加載CSS，并且其實(shí)在CSS2.1提出的刮便，低版本瀏覽器不支持
- link引用css時(shí)空猜，在頁(yè)面載入時(shí)同時(shí)加載，而@important需要頁(yè)面網(wǎng)頁(yè)完全載入后加載
- link支持使用javascript控制DOM去改變樣式恨旱；@important不支持
14.瀏覽器的內(nèi)核分別是什么辈毯？
- Trident內(nèi)核：IE、傲游搜贤、世界之窗瀏覽器谆沃、騰訊TT、AVANT等
- Gecko內(nèi)核：Firefox仪芒、Netscape6至9
- Webkit內(nèi)核：Safari唁影、Google耕陷、Chrome
- Presto內(nèi)核：Opera
15.常見兼容性問(wèn)題及解決方案？
- 不同瀏覽器下默認(rèn)標(biāo)簽的margin和padding不同------css重置
- 塊屬性標(biāo)簽float后据沈，又有橫向的margin情況下啃炸，在IE6顯示margin比設(shè)置的大--------在float標(biāo)簽樣式控制中加入display：inline，轉(zhuǎn)化為行內(nèi)屬性卓舵，但是行內(nèi)元素寬高不可設(shè)，所有需要在后面再加上display：table
- 設(shè)置較小高度標(biāo)簽（一般10px）膀钠，在IE6\IE7掏湾，遨游中高度超出自己設(shè)置高度-----給超出高度的標(biāo)簽設(shè)置overflow：hidden；或者設(shè)置行高line-hight小于你設(shè)置的高度
備注：這種情況一般出現(xiàn)在我們?cè)O(shè)置小圓角背景的標(biāo)簽里肿嘲。出現(xiàn)這個(gè)問(wèn)題的原因是IE8之前的瀏覽器都會(huì)給標(biāo)簽一個(gè)最小默認(rèn)的行高的高度融击。即使你的標(biāo)簽是空的，這個(gè)標(biāo)簽的高度還是會(huì)達(dá)到默認(rèn)的行高雳窟。 - 幾個(gè)img標(biāo)簽放在一起的時(shí)候尊浪，有寫瀏覽器會(huì)有默認(rèn)的間距-----使用float屬性為img布局
