在平平淡淡的日常中，我們都離不開試題，借助試題可以為主辦方提供考生某方面的知識或技能狀況的信息。一份好的試題都是什么樣子的呢？以下是小編整理的web前端面試題及答案，希望能夠幫助到大家。

web前端面試題及答案1

　　1、Doctype作用？嚴格模式與混雜模式如何區(qū)分？它們有何意義？

　�。�1）、聲明位于文檔中的最前面，處于標簽之前。告知瀏覽器的解析器，用什么文檔類型規(guī)范來解析這個文檔。

　�。�2）、嚴格模式的排版和JS運作模式是以該瀏覽器支持的最高標準運行。

　�。�3）、在混雜模式中，頁面以寬松的向后兼容的方式顯示。模擬老式瀏覽器的行為以防止站點無法工作。

　�。�4）、DOCTYPE不存在或格式不正確會導致文檔以混雜模式呈現(xiàn)。

　　2、行內(nèi)元素有哪些？塊級元素有哪些？

　�。�1）CSS規(guī)范規(guī)定，每個元素都有display屬性，確定該元素的類型，每個元素都有默認的display值，比如div默認display屬性值為“block”，成為“塊級”元素；span默認display屬性值為“inline”，是“行內(nèi)”元素。

　�。�2）行內(nèi)元素有：a b span img input select strong（強調(diào)的語氣）塊級元素有：div ulol li dl dtdd h1 h2 h3 h4…p

　　3、link和@import的區(qū)別是？

　�。�1）link屬于XHTML標簽，而@import是CSS提供的；

　�。�2）頁面被加載的時，link會同時被加載，而@import引用的CSS會等到頁面被加載完再加載；

　�。�3）import只在IE5以上才能識別，而link是XHTML標簽，無兼容問題；

　�。�4）link方式的樣式的權重高于@import的權重。

　　4、瀏覽器的內(nèi)核分別是什么？

　　IE瀏覽器的內(nèi)核Trident、Mozilla的Gecko、Chrome的Blink（WebKit的分支）、Opera內(nèi)核原為Presto，現(xiàn)為Blink；

　　5、HTML5有哪些新特性？如何處理HTML5新標簽的瀏覽器兼容問題？如何區(qū)分HTML和HTML5？

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

　　繪畫canvas用于媒介回放的video和audio元素本地離線存儲localStorage長期存儲數(shù)據(jù)，瀏覽器關閉后數(shù)據(jù)不丟失；sessionStorage的數(shù)據(jù)在瀏覽器關閉后自動刪語意化更好的內(nèi)容元素，比如article、footer、header、nav、section表單控件，calendar、date、time、email、url、search新的技術webworker，websockt，Geolocation

　　6、對語義化如何理解？

　�。�1）import只在IE5以上才能識別，而link是XHTML標簽，無兼容問題；

　�。�2）link方式的樣式的權重高于@import的權重。

　　4、瀏覽器的內(nèi)核分別是什么？

　　IE瀏覽器的內(nèi)核Trident、Mozilla的Gecko、Chrome的Blink（WebKit的分支）、Opera內(nèi)核原為Presto，現(xiàn)為Blink；

　　5、HTML5有哪些新特性？如何處理HTML5新標簽的瀏覽器兼容問題？如何區(qū)分HTML和HTML5？

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

　　繪畫canvas用于媒介回放的video和audio元素本地離線存儲localStorage長期存儲數(shù)據(jù)，瀏覽器關閉后數(shù)據(jù)不丟失；sessionStorage的數(shù)據(jù)在瀏覽器關閉后自動刪語意化更好的內(nèi)容元素，比如article、footer、header、nav、section表單控件，calendar、date、time、email、url、search新的技術webworker，websockt，Geolocation

　　6、對語義化如何理解？

　�。�3）import只在IE5以上才能識別，而link是XHTML標簽，無兼容問題；

　　（4）link方式的樣式的權重高于@import的權重。

　　4、瀏覽器的內(nèi)核分別是什么？

　　IE瀏覽器的內(nèi)核Trident、Mozilla的Gecko、Chrome的Blink（WebKit的`分支）、Opera內(nèi)核原為Presto，現(xiàn)為Blink；

　　5、HTML5有哪些新特性？如何處理HTML5新標簽的瀏覽器兼容問題？如何區(qū)分HTML和HTML5？

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

　　繪畫canvas用于媒介回放的video和audio元素本地離線存儲localStorage長期存儲數(shù)據(jù)，瀏覽器關閉后數(shù)據(jù)不丟失；sessionStorage的數(shù)據(jù)在瀏覽器關閉后自動刪語意化更好的內(nèi)容元素，比如article、footer、header、nav、section表單控件，calendar、date、time、email、url、search新的技術webworker，websockt，Geolocation

　　6、對語義化如何理解？

　　用正確的標簽做正確的事情！

　　HTML語義化就是讓頁面的內(nèi)容結構化，便于對瀏覽器、搜索引擎解析；在沒有樣式CCS情況下也以一種文檔格式顯示，并且是容易閱讀的。搜索引擎的爬蟲依賴于標記來確定上下文和各個關鍵字的權重，利于SEO。使閱讀源代碼的人對網(wǎng)站更容易將網(wǎng)站分塊，便于閱讀維護理解。

　　7、HTML5的離線儲存有幾種方式？

　　localStorage長期存儲數(shù)據(jù)，瀏覽器關閉后數(shù)據(jù)不丟失；sessionStorage數(shù)據(jù)在瀏覽器關閉后自動刪除。

　　8、iframe有那些缺點？

　　iframe會阻塞主頁面的Onload事件；

　　iframe和主頁面共享連接池，而瀏覽器對相同域的連接有限制，所以會影響頁面的并行加載。使用iframe之前需要考慮這兩個缺點。如果需要使用iframe，最好是通過javascript動態(tài)給iframe添加src屬性值，這樣可以可以繞開以上兩個問題。

　　9、請描述一下cookies，sessionStorage和localStorage的區(qū)別？

　　cookie在瀏覽器和服務器間來回傳遞。sessionStorage和localStorage不會sessionStorage和localStorage的存儲空間更大；sessionStorage和localStorage有更多豐富易用的接口；sessionStorage和localStorage各自獨立的存儲空間；

web前端面試題及答案2

　　1、對WEB標準以及W3C的理解與認識

　　標簽閉合、標簽小寫、不亂嵌套、提高搜索機器人搜索幾率、使用外鏈css和js腳本、結構行為表現(xiàn)的分離、文件下載與頁面速度更快、內(nèi)容能被更多的用戶所訪問、內(nèi)容能被更廣泛的設備所訪問、更少的代碼和組件，容易維護、改版方便，不需要變動頁面內(nèi)容、提供打印版本而不需要復制內(nèi)容、提高網(wǎng)站易用性；

　　2、xhtml和html有什么區(qū)別

　　HTML是一種基本的WEB網(wǎng)頁設計語言，XHTML是一個基于XML的置標語言

　　最主要的不同：

　　XHTML元素必須被正確地嵌套。

　　XHTML元素必須被關閉。

　　標簽名必須用小寫字母。

　　XHTML文檔必須擁有根元素。

　　3、Doctype？嚴格模式與混雜模式—如何觸發(fā)這兩種模式，區(qū)分它們有何意義？

　　用于聲明文檔使用那種規(guī)范（html/Xhtml）一般為嚴格過度基于框架的html文檔加入XMl聲明可觸發(fā)，解析方式更改為IE5、5擁有IE5、5的bug

　　4、行內(nèi)元素有哪些？塊級元素有哪些？CSS的盒模型？

　　塊級元素：div p h1 h2 h3 h4 form ul

　　行內(nèi)元素：a b br i span input select

　　Css盒模型：內(nèi)容，border，margin，padding

　　5、CSS引入的方式有哪些？link和@import的區(qū)別是？

　　內(nèi)聯(lián)內(nèi)嵌外鏈導入

　　區(qū)別：同時加載

　　前者無兼容性，后者CSS2、1以下瀏覽器不支持

　　Link支持使用javascript改變樣式，后者不可

　　6、CSS選擇符有哪些？哪些屬性可以繼承？優(yōu)先級算法如何計算？內(nèi)聯(lián)和important哪個優(yōu)先級高？

　　標簽選擇符類選擇符id選擇符

　　繼承不如指定Id>class>標簽選擇

　　后者優(yōu)先級高

　　7、前端頁面有哪三層構成，分別是什么？作用是什么？

　　結構層Html表示層CSS行為層js

　　8、css的基本語句構成是？

　　選擇器{屬性1：值1；屬性2：值2；……}

　　9、你做的頁面在哪些流覽器測試過？這些瀏覽器的內(nèi)核分別是什么？

　　Ie（Ie內(nèi)核）火狐（Gecko）谷歌（webkit）opear（Presto）

　　10、寫出幾種IE6 BUG的解決方法

　　1、雙邊距BUG float引起的使用display

　　2、3像素問題使用float引起的使用dislpay：inline —3px

　　3、超鏈接hover點擊后失效使用正確的書寫順序link visited hover active

　　4、Ie z—index問題給父級添加position：relative

　　5、Png透明使用js代碼改

　　6、Min—height最小高度！Important解決’

　　7、select在ie6下遮蓋使用iframe嵌套

　　8、為什么沒有辦法定義1px左右的寬度容器（IE6默認的行高造成的，使用

　　over：hidden，zoom：0。08 line—height：1px）

　　11、標簽上title與alt屬性的區(qū)別是什么？

　　Alt當圖片不顯示是用文字代表。

　　Title為該屬性提供信息

　　12、描述css reset的作用和用途。

　　Reset重置瀏覽器的css默認屬性瀏覽器的品種不同，樣式不同，然后重置，讓他們統(tǒng)一

　　13、解釋css sprites，如何使用。

　　Css精靈把一堆小的圖片整合到一張大的圖片上，減輕服務器對圖片的請求數(shù)量

　　14、瀏覽器標準模式和怪異模式之間的區(qū)別是什么？

　　盒子模型渲染模式的不同

　　使用window。top。document。compatMode可顯示為什么模式

　　15、你如何對網(wǎng)站的'文件和資源進行優(yōu)化？期待的解決方案包括：

　　文件合并

　　文件最小化/文件壓縮

　　使用CDN托管

　　緩存的使用

　　16、什么是語義化的HTML？

　　直觀的認識標簽對于搜索引擎的抓取有好處

　　17、清除浮動的幾種方式，各自的優(yōu)缺點

　　1、使用空標簽清除浮動clear：both（理論上能清楚任何標簽，增加無意義的標簽）

　　2、使用overflow：auto（空標簽元素清除浮動而不得不增加無意代碼的弊端，使用zoom：1用于兼容IE）

　　3、是用afert偽元素清除浮動（用于非IE瀏覽器）

　　18、舉出3個HTML5 / CSS3特效的例子

　　圓角，陰影，放大/縮小，轉(zhuǎn)動等

　　Javascript

　　1、javascript的[返回哪些數(shù)據(jù)類型

　　Object number function boolean underfind

　　2、函數(shù)的幾種定義方法

　　function a（）{}，var a = function（）{}

　　3、在javascript中，以聲明變量名的規(guī)則

　　1、變量名是嚴格區(qū)別分小寫的，如變量abc和ABC是兩個變量，可以在程序分別對其進行聲明，賦值和引用。

　　2、js中變量名必須以字母，其余可以包括數(shù)字，字符和_，如temp，abc，exmple2就是合法的變量名。

　　3、不能引用javascript中的關鍵字作為變量，在javascript中定義了40多個關鍵字，這些關鍵字都是是javascript內(nèi)部使用的，不能作為變量的名稱，如var，true，int等不能作為變量名使用。

　　4、document load和document ready的區(qū)別

　　Document。onload是在結構和樣式加載完才執(zhí)行js

　　Document。ready原生種沒有這個方法，jquery中有$（）。ready（function）

　　5、使用JQ插入刪除替換到某個節(jié)點的常用方法

　　插入：append（），prepend（），after（）等等

　　刪除：remove（），detach（）和empty（）

　　替換：replaceWith（）和replaceAll（）

【web前端面試題及答案】相關文章：

web前端自我評價07-27

web前端實習報告03-27

web前端畢業(yè)實習報告09-04

web前端應聘簡歷模板08-21

web前端開發(fā)實習報告06-21

web前端實習報告范文06-22

達內(nèi)web前端簡歷模板08-22

web前端自我評價6篇07-27

web前端總結（通用5篇）07-23