1、 說下行內(nèi)元素和塊級(jí)元素的區(qū)別?行內(nèi)塊元素的兼容性使用?(IE8 以下)

答：行內(nèi)元素：會(huì)在水平方向排列，不能包含塊級(jí)元素，設(shè)置width無效，height無效(可以設(shè)置line-height)，margin上下無效，padding上下無效。塊級(jí)元素：各占據(jù)一行，垂直方向排列。從新行開始結(jié)束接著一個(gè)斷行。兼容性：display:inline-block;*display:inline;*zoom:1。

2、box-sizing常用的屬性有哪些?分別有什么作用?

答：box-sizing: content-box|border-box|inherit。content-box:寬度和高度分別應(yīng)用到元素的內(nèi)容框。在寬度和高度之外繪制元素的內(nèi)邊距和邊框(元素默認(rèn)效果)。

border-box:元素指定的任何內(nèi)邊距和邊框都將在已設(shè)定的寬度和高度內(nèi)進(jìn)行繪制。通過從已設(shè)定的寬度和高度分別減去邊框和內(nèi)邊距才能得到內(nèi)容的寬度和高度。

3、Doctype作用?標(biāo)準(zhǔn)模式與兼容模式各有什么區(qū)別?

答：告知瀏覽器的解析器用什么文檔標(biāo)準(zhǔn)解析這個(gè)文檔。DOCTYPE不存在或格式不正確會(huì)導(dǎo)致文檔以兼容模式呈現(xiàn)。

標(biāo)準(zhǔn)模式的排版和JS運(yùn)作模式都是以該瀏覽器支持的最高標(biāo)準(zhǔn)運(yùn)行。在兼容模式中，頁面以寬松的向后兼容的方式顯示,模擬老式瀏覽器的行為以防止站點(diǎn)無法工作。

4、html5有哪些新特性?如何處理HTML5新標(biāo)簽的瀏覽器兼容問題?如何區(qū)分 HTML 和 HTML5?

答：HTML5 現(xiàn)在已經(jīng)不是 SGML 的子集，主要是關(guān)于圖像，位置，存儲(chǔ)，多任務(wù)等功能的增加。

(1)繪畫 canvas;

(2)用于媒介回放的 video 和 audio 元素;

(3)本地離線存儲(chǔ) localStorage 長(zhǎng)期存儲(chǔ)數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失;

(4)sessionStorage 的數(shù)據(jù)在瀏覽器關(guān)閉后自動(dòng)刪除;

(5)語意化更好的內(nèi)容元素，比如 article、footer、header、nav、section;

(6)表單控件，calendar、date、time、email、url、search;

(7)新的技術(shù)webworker, websocket, Geolocation;

IE8/IE7/IE6支持通過方法產(chǎn)生的標(biāo)簽，可以利用這一特性讓這些瀏覽器支持HTML5新標(biāo)簽，瀏覽器支持新標(biāo)簽后，還需要添加標(biāo)簽?zāi)J(rèn)的樣式。當(dāng)然也可以直接使用成熟的框架、比如html5shim。

以上就是環(huán)球青藤小編關(guān)于web前端面試題的相關(guān)分享，希望對(duì)大家有所幫助，想要了解更多相關(guān)內(nèi)容，請(qǐng)及時(shí)關(guān)注本平臺(tái)并進(jìn)行查看!