两年工做经验梳理40道面试题：看他如何拿下大厂offer！

距离“金九银十”还有半个月，目前的你是否有一颗跳槽的心呢？在此以前播妞总结了一些阿里的面试题，此次播妞应粉丝的要求，总结了与前端相关的面试题，其中包括阿里+网易等大厂面试题，相信你看完以后必定会跳槽成功哦~css

因为题目较多，答案内容较详细，如下为部分题目及部分答案，完整版文末查看获取方式哦~前端

· CSS经常使用布局web

参考答案：面试

CSS经常使用布局为盒模型div+css、其中须要注意IE的怪异盒模型，咱们一般经过box-sizing解决。传统盒模型布局方式中咱们能够细分为文档流布局、浮动布局、定位布局。在ie10+中咱们可使用flex布局，其中咱们须要理解最为核心的容器和轴的概念。二维布局中，咱们可使用Grid布局。对于三栏布局，除了浮动实现方式，还有双飞翼布局和圣杯布局。其实双飞翼布局就是对圣杯布局的bug修复，一种改造升级。移动web开发

· 什么是渐进式渲染（progressive rendering）浏览器

部分参考答案：网络

渐进式渲染是用于提升网页性能（尤为是提升用户感知的加载速度），以尽快呈现页面的技术。在之前互联网带宽较小的时期，这种技术更为广泛。现在，移动终端的盛行，而移动网络每每不稳定，渐进式渲染在现代前端开发中仍然有用武之地。布局

· BFC性能

部分参考答案：字体

BFC即为块级格式化上下文。在普通流的Box属于一种formatting box，类型能够为block或者为inline。可是不能同时为这二者。而且Block boxes在block formatting context里格式化，inline boxes在inline formatting context中格式化，任何被渲染的元素都属于一个box，不是block就是inline。

· Viewport

部分参考答案：

字面意思为视图窗口，在移动web开发中使用。表示将设备浏览器宽度虚拟成一个特定的值（或计算得出），这样利于移动web站点跨设备显示效果基本一致。移动版的 Safari 浏览器最新引进了 viewport 这个 meta tag，让网页开发者来控制 viewport 的大小和缩放，其余手机浏览器也基本支持。

· Viewport属性值

部分参考答案：

width 设置layout viewport 的宽度，为一个正整数，或字符串"width-device"

initial-scale 设置页面的初始缩放值，为一个数字，能够带小数

minimum-scale 容许用户的最小缩放值，为一个数字，能够带小数

maximum-scale 容许用户的最大缩放值，为一个数字，能够带小数

· Reflow和Repaint

部分参考答案：

Reflow：

当涉及到DOM节点的布局属性发生变化时，就会从新计算该属性，浏览器会从新描绘相应的元素，此过程叫Reflow（回流或重排）。

Repaint：

当影响DOM元素可见性的属性发生变化 (如 color) 时, 浏览器会从新描绘相应的元素, 此过程称为Repaint（重绘）。所以重排必然会引发重绘。

· img中的alt和元素的title属性做用

部分参考答案：

img的alt属性：若是没法显示图像，浏览器将显示alt指定的内容

元素title属性：在鼠标移到元素上时显示title的内容

· href和src区别

部分参考答案：

href标识超文本引用，用在link和a等元素上，href是引用和页面关联，是在当前元素和引用资源之间创建联系

若在文档中添加href ，浏览器会识别该文档为 CSS 文件，就会并行下载资源而且不会中止对当前文档的处理。这也是为何建议使用 link 方式加载 CSS，而不是使用 @import 方式。

· 浏览器的渲染过程

部分参考答案：

解析HTML生成DOM树；解析CSS生成CSSOM规则树；将DOM树与CSSOM规则树合并在一块儿生成渲染树；遍历渲染树开始布局，计算每一个节点的位置大小信息；将渲染树每一个节点绘制到屏幕。

· px/em/rem的区别

部分参考答案：

px顾名思义就是咱们一般说的像素大小。em和rem都是相对大小，不过em是继承父级元素的字体大小，rem是相对于根元素的大小，这个单位可谓是集相对大小和绝对大小为一身。经过它能够作到只修改根元素便可修改全部字体的大小，又能够避免字体大小逐层复合的连锁反应。当rem相对于浏览器进行缩放，1rem默认为16px。

· animation和transition

部分参考答案：

写法：animation：name duration timing-function delay iteration-function direction .transition为过渡动画，这种效果能够在事件中触发，而且圆滑的以动画效果改变css的属性值。不一样于transform，transform为2D转换。