初級web前端工程師面試必看（HTML+CSS）

1.對WEB標準以及W3C的理解與認識 標籤閉合、標籤小寫、不亂嵌套、提高搜索機器人搜索幾率、使用外 鏈css和js腳本、結構行為表現的分離、文件下載與頁面速度更快、內容能被更多的用戶所訪問、內容能被更廣泛的設備所訪問、更少的代碼和組件，容易維 護、改版方便，不需要變動頁面內容、提供列印版本而不需要複製內容、提高網站易用性。

2.xhtml和html有什麼區別？ HTML是一種基本的WEB網頁設計語言，XHTML是一個基於XML的置標語言 最主要的不同： XHTML 元素必須被正確地嵌套。 XHTML 元素必須被關閉。 標籤名必須用小寫字母。 XHTML 文檔必須擁有根元素。

3.Doctype? 嚴格模式與混雜模式-如何觸發這兩種模式，區分它們有何意義? 用於聲明文檔使用那種規範（html/Xhtml）一般為 嚴格 過度 基於框架的html文檔 加入XMl聲明可觸發，解析方式更改為IE5.5 擁有IE5.5的bug

4.行內元素有哪些?塊級元素有哪些?CSS的盒模型? 塊級元素：div p h1 h2 h3 h4 form ul 行內元素: a b br i span input select Css盒模型:內容，padding，border ,margin

5.CSS引入的方式有哪些? link和@import的區別是? 內聯 內嵌 外鏈 導入 區別 ：同時載入 前者無兼容性，後者CSS2.1以下瀏覽器不支持 Link 支持使用javascript改變樣式，後者不可

6.CSS選擇符有哪些?哪些屬性可以繼承?優先順序演算法如何計算?內聯和important哪個優先順序高? 標籤選擇符 類選擇符 id選擇符 繼承不如指定 Id>class>標籤選擇 後者優先順序高

7.前端頁面有哪三層構成，分別是什麼? 結構層 Html、 表示層 CSS、行為層 js

8.css的基本語句構成是? 選擇器{屬性1:值1;屬性2:值2;……}

9.你做的頁面在哪些流覽器測試過?這些瀏覽器的內核分別是什麼? Ie(Ie內核) 火狐（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屬性的區別是什麼? Alt 當圖片不顯示是 用文字代表。 Title 為該屬性提供信息

12.描述css reset的作用和用途。 Reset重置瀏覽器的css默認屬性 瀏覽器的品種不同，樣式不同，然後重置，讓他們統一

13.解釋css sprites，如何使用。 Css 精靈 把一堆小的圖片整合到一張大的圖片上，減輕伺服器對圖片的請求數量

14.瀏覽器標準模式和怪異模式之間的區別是什麼? 盒子模型 渲染模式的不同 使用 window.top.document.compatMode 可顯示為什麼模式

15.你如何對網站的文件和資源進行優化?期待的解決方案包括： 文件合併 文件最小化/文件壓縮 使用CDN託管 緩存的使用

16.什麼是語義化的HTML? 直觀的認識標籤 對於搜索引擎的抓取有好處

17.清除浮動的幾種方式，各自的優缺點 1.使用空標籤清除浮動 clear:both（理論上能清楚任何標籤，，，增加無意義的標籤） 2.使用overflow:auto（空標籤元素清除浮動而不得不增加無意代碼的弊端,,使用zoom:1用於兼容IE） 3.是用afert偽元素清除浮動(用於非IE瀏覽器)

如有需要了解關於JS以及前端的小夥伴們可來我的前端群：430036043，這裡有小編收集到的各部分資料以及案例，望能幫到各位。

如果對你學習上有一點點幫助，那就分享到你的朋友圈吧，謝謝點評