HTML+CSS前端工程師筆試題目
導讀：前端工程師的職責是制作標準優(yōu)化的代碼，并增加交互動(dòng)態(tài)功能，開(kāi)發(fā)JavaScript以及Flash模塊，同時(shí)結合后臺開(kāi)發(fā)技術(shù)模擬整體效果，進(jìn)行豐富互聯(lián)網(wǎng)的Web開(kāi)發(fā)，致力于通過(guò)技術(shù)改善用戶(hù)體驗。以下是由應屆畢業(yè)生網(wǎng)小編J.L為您整理推薦的前端工程師筆試題目，歡迎參考閱讀。
1.對WEB標準以及W3C的理解與認識
標簽閉合、標簽小寫(xiě)、不亂嵌套、提高搜索機器人搜索幾率、使用外鏈css和js腳本、結構行為表現的分離、文件下載與頁(yè)面速度更快、內容能被更多的用戶(hù)所訪(fǎng)問(wèn)、內容能被更廣泛的設備所訪(fǎng)問(wèn)、更少的代碼和組件，容易維護、改版方便，不需要變動(dòng)頁(yè)面內容、提供打印版本而不需要復制內容、提高網(wǎng)站易用性;
2.xhtml和html有什么區別
HTML是一種基本的WEB網(wǎng)頁(yè)設計語(yǔ)言，XHTML是一個(gè)基于XML的置標語(yǔ)言
最主要的不同：
XHTML 元素必須被正確地嵌套。
XHTML 元素必須被關(guān)閉。
標簽名必須用小寫(xiě)字母。
XHTML 文檔必須擁有根元素。
3.Doctype? 嚴格模式與混雜模式-如何觸發(fā)這兩種模式，區分它們有何意義?
用于聲明文檔使用那種規范(html/Xhtml)一般為 嚴格 過(guò)度 基于框架的html文檔
加入XMl聲明可觸發(fā)，解析方式更改為IE5.5 擁有IE5.5的bug
4.行內元素有哪些?塊級元素有哪些?CSS的盒模型?
塊級元素：div p h1 h2 h3 h4 form ul
行內元素: a b br i span input select
Css盒模型:內容，border ,margin，padding
5.CSS引入的方式有哪些? link和@import的區別是?
內聯(lián) 內嵌 外鏈 導入
區別 ：同時(shí)加載
前者無(wú)兼容性，后者CSS2.1以下瀏覽器不支持
Link 支持使用javascript改變樣式，后者不可
6.CSS選擇符有哪些?哪些屬性可以繼承?優(yōu)先級算法如何計算?內聯(lián)和important哪個(gè)優(yōu)先級高?
標簽選擇符 類(lèi)選擇符 id選擇符
繼承不如指定 Id>class>標簽選擇
后者優(yōu)先級高
7.前端頁(yè)面有哪三層構成，分別是什么?作用是什么?
結構層 Html 表示層 CSS 行為層 js
8.css的基本語(yǔ)句構成是?
選擇器{屬性1:值1;屬性2:值2;……}
9.你做的頁(yè)面在哪些流覽器測試過(guò)?這些瀏覽器的內核分別是什么?
Ie(Ie內核) 火狐(Gecko) 谷歌(webkit) opear(Presto)
10.寫(xiě)出幾種IE6 BUG的解決方法
1.雙邊距BUG float引起的 使用display
2.3像素問(wèn)題 使用float引起的 使用dislpay:inline -3px
3.超鏈接hover 點(diǎn)擊后失效 使用正確的書(shū)寫(xiě)順序 link visited hover active
4.Ie z-index問(wèn)題 給父級添加position:relative
5.Png 透明 使用js代碼 改
6.Min-height 最小高度 !Important 解決’
7.select 在ie6下遮蓋 使用iframe嵌套
8.為什么沒(méi)有辦法定義1px左右的寬度容器(IE6默認的行高造成的，使用over:hidden,zoom:0.08 line-height:1px)
11.標簽上title與alt屬性的區別是什么?
Alt 當圖片不顯示是 用文字代表。
Title 為該屬性提供信息
12.描述css reset的作用和用途。
Reset重置瀏覽器的css默認屬性 瀏覽器的品種不同，樣式不同，然后重置，讓他們統一
13.解釋css sprites，如何使用。
Css 精靈 把一堆小的圖片整合到一張大的圖片上，減輕服務(wù)器對圖片的請求數量
14.瀏覽器標準模式和怪異模式之間的區別是什么?
盒子模型 渲染模式的不同
使用 window.top.document.compatMode 可顯示為什么模式
15.你如何對網(wǎng)站的文件和資源進(jìn)行優(yōu)化?期待的解決方案包括：
文件合并
文件最小化/文件壓縮
使用CDN托管
緩存的使用
16.什么是語(yǔ)義化的HTML?
直觀(guān)的認識標簽 對于搜索引擎的抓取有好處
17.清除浮動(dòng)的幾種方式，各自的優(yōu)缺點(diǎn)
1.使用空標簽清除浮動(dòng) clear:both(理論上能清楚任何標簽，，，增加無(wú)意義的標簽)
2.使用overflow:auto(空標簽元素清除浮動(dòng)而不得不增加無(wú)意代碼的弊端,,使用zoom:1用于兼容IE)
3.是用afert偽元素清除浮動(dòng)(用于非IE瀏覽器)
Javascript
1.javascript的typeof返回哪些數據類(lèi)型
Object number function boolean underfind
2.例舉3種強制類(lèi)型轉換和2種隱式類(lèi)型轉換?
強制(parseInt,parseFloat,number)
隱式(== - ===)
3.split() join() 的區別
前者是切割成數組的形式，后者是將數組轉換成字符串
4.數組方法pop() push() unshift() shift()
Push()尾部添加 pop()尾部刪除
Unshift()頭部添加 shift()頭部刪除
5.事件綁定和普通事件有什么區別
6.IE和DOM事件流的區別
1.執行順序不一樣、
2.參數不一樣
3.事件加不加on
4.this指向問(wèn)題
7.IE和標準下有哪些兼容性的寫(xiě)法
Var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target
8.ajax請求的時(shí)候get 和post方式的區別
一個(gè)在url后面 一個(gè)放在虛擬載體里面
有大小限制
安全問(wèn)題
應用不同 一個(gè)是論壇等只需要請求的，一個(gè)是類(lèi)似修改密碼的
9.call和apply的區別
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)
10.ajax請求時(shí)，如何解釋json數據
使用eval parse 鑒于安全性考慮 使用parse更靠譜
11.b繼承a的方法
12.寫(xiě)一個(gè)獲取非行間樣式的函數
13.事件委托是什么
讓利用事件冒泡的原理，讓自己的'所觸發(fā)的事件，讓他的父元素代替執行!
14.閉包是什么，有什么特性，對頁(yè)面有什么影響
閉包就是能夠讀取其他函數內部變量的函數。
15.如何阻止事件冒泡和默認事件
canceBubble return false
16.添加 刪除 替換 插入到某個(gè)接點(diǎn)的方法
obj.appendChidl()
obj.innersetBefore
obj.replaceChild
obj.removeChild
17.解釋jsonp的原理，以及為什么不是真正的ajax
動(dòng)態(tài)創(chuàng )建script標簽，回調函數
Ajax是頁(yè)面無(wú)刷新請求數據操作
18.javascript的本地對象，內置對象和宿主對象
本地對象為array obj regexp等可以new實(shí)例化
內置對象為gload Math 等不可以實(shí)例化的
宿主為瀏覽器自帶的document,window 等
19.document load 和document ready的區別
Document.onload 是在結構和樣式加載完才執行js
Document.ready原生種沒(méi)有這個(gè)方法，jquery中有 $().ready(function)
20.”==”和“===”的不同
前者會(huì )自動(dòng)轉換類(lèi)型
后者不會(huì )
21.javascript的同源策略
一段腳本只能讀取來(lái)自于同一來(lái)源的窗口和文檔的屬性，這里的同一來(lái)源指的是主機名、協(xié)議和端口號的組合
22.編寫(xiě)一個(gè)數組去重的方法
23.排序算法
【HTML+CSS前端工程師筆試題目】相關(guān)文章：
騰訊前端筆試題目01-15
筆試百度的前端工程師經(jīng)歷02-24
質(zhì)量工程師筆試題目12-17
阿里在線(xiàn)前端筆試題01-15
最新前端開(kāi)發(fā)筆試題（題目列表+答案 完整版）02-23
完整版前端工程師筆試問(wèn)題列表02-24
軟件研發(fā)工程師筆試題目12-08
測試工程師筆試題目分享12-08