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模式下却会失效。

未完待续