2018 前端面試題（不按期更新）

時間 2019-12-14

標籤端面試題按期更新简体版

原文原文鏈接

前端基礎面試題

如下更多的題目，但願你們能掌握更多的前端知識，發現自身的不足。不僅僅是看題目，背答案。css

面試題應該反映出的只是你掌握前端知識的冰山一角。別把冰山全貌給展示出來咯html

HTML/CSS前端

一、什麼是盒子模型？

你們有沒有感受，就是面試時幾乎都會被問到的什麼是盒子模型？面試

我想你們應該回答都是「哦，盒子模型啊，就是外邊距+邊框+內邊距+容器自身的寬高」。瀏覽器

也就是下面這張圖，沒錯這樣回答大部門面試官就這樣放過你了ui

這是標準的盒子模型spa

若是面試官想再深刻一下呢，IE的盒子模型和你說的盒子模型有什麼區別呢？htm

咯咯，心裏不要罵IE！！！blog

Do you know!!!文檔

IE的盒子模型被噴了N年以後，你們發現實際上還挺好用。

box-sizing:border-box;

這個css的樣式，你們可能不是很陌生吧。

沒錯它的計算方法就是IE的盒子模型[外邊距+寬高(內邊距+邊框+容器寬高)]；

box-sizing:content-box;(這個是標準模型)；

二、行內元素有哪些？塊級元素有哪些？

常規題

除了img是inline-block之外。

其餘的扔在代碼裏，看看會不會換行。

3，Doctype

這個東西厲害了。

講真，我寫前端6年了，你讓我背，我還真不能一字不差的背不出那一長串。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Doctype的做用是申明文檔類型

通常會問的點，爲何要寫這麼一段。

這裏標準答案，應該是肯定標準或是怪異模式。

1）盒模型： IE下標準模式爲標準w3c盒模型【content+padding+border+margin】，怪異模式爲IE盒模型【content+margin：padding與border包含在content寬高中】
2）行內元素的垂直對齊：基於 Gecko 的瀏覽器【Mozilla Firefox、HotBrowser、Mozilla Suite、Camino】標準模式對齊至基線，怪異模式對齊至底部
3）怪異模式中，IE6/7/8都不認識!important聲明
4）設置行內元素的高寬：在Standards模式下，給等行內元素設置wdith和height都不會生效，而在quirks模式下，則會生效。
5）使用margin:0 auto在standards模式下可使元素水平居中，但在quirks模式下卻會失效。

未完待續

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。