前言

看到一位博主吐槽怎么当初很多前端面试中，很多公司很少或不问 css，而间接问 JavaScript、框架、Node.js 这个问题，说到当初满世界 Vue、小程序的简历，问啥 css 啊，好多人 position 有啥值都不晓得，z-index 值和 position 层叠关系都不晓得，问了就挂，咋张嘴问…… 就更别提啥权重值怎么计算的这种略微“难”一点点的问题了，考查更深刻一点的，比方值解决步骤乃至到 CSSOM 就想都别想了。

集体是认为这阐明业界前端的业务以 pc 零碎后盾类的居多。当初这些后盾，不再须要兼容 IE，界面有相对来说规定，而且又有 postcss 这类 css 编译工具，基本上不会有太大的 css 问题。然而如果一个前端团队以挪动端业务开发为主的，那 css 能够问的问题还是很多的。

注释

但我这边是要面的。很多公司面人的问题千奇百怪，甚至是很脱离实际开发工作，我集体对这样的面试没有好感，我本人弄了一套面试题目。十分遗憾，我的问题不多，也不偏离业务开发，但面试快一年了，全答上的面试者有一个。那哥们我很喜爱，给了 offer，不过他人没选我这边。其余的起码大几十个面试者，都或多或少地“翻车”，我也只能挑几个翻车不重大的人进 2 面。哪里翻车最重大？CSS！我只有 4 道 CSS 面试题，90% 的面试者翻车。

• 第一道：有 3 个 div，呈竖向排列，第一个 div 贴顶，第三个 div 贴底，两头的 div 填满残余空间。该怎么做？（flex，grid，js 动静计算）
• 第二道：我要写一个弹窗，须要程度竖直居中，同时它不能被其余元素遮掩。该怎么做？
  （居中，zindex，zindex 的从父准则）
• 第三道：你的挪动端的自适应是怎么做的？
  （rem，vwvh。其实这两个等比放大放大的自适应单位解决方案是不够完满的。内容用 px + 排版用自适应单位 + 布局采纳 flex/grid 才是解决挪动端自适应的最优解）
• 第四道：如何缩小重排。

这 4 个题是真的不难，我原先的构想是搞几道 css 做开胃菜，缓缓深刻理解面试者，然而这个翻车率是我始料未及的，特地是很多的面试者都在简历上注明：善于 / 纯熟应用 Flex 布局。想想面试那段时间都挺头疼的，比方发申请拿数据，每个前端都要做的事。问怎么辨别返回内容是文件流还是 json 数据，其实就一个 content-type，答上来的人不多。问平时怎么上传文件的？就一个 form-data，很多人也不会。再问怎么看一个资源的缓存状况，一个 control-cache，就更没人会了…我不想问一些 httptcp、什么链路层、什么三次握手、什么 https 的加密规定，平时工作用不着，刻意去背一背应酬面试，不见得能体现一个面试者的程度。但我问的这些这么实操的货色都不知所云，那是相对行不通的。当初很多前端，只会跑 vue-cli 搭建个我的项目，import 一下 ui 库，就感觉本人没问题了，实际上在我眼里连日常开发工作都应酬不了。

我这种还算好的了，碰到喜爱出越深越好，越偏门面试题的，可能是真不想招人，不想要 KPI，但要是换他来答题，十有八九更差劲（别杠，杠就是你对）。尽管说是问 CSS 少了，但不怕一万就怕万一，咱们可别因没筹备吃了哑巴亏，所以我整顿了一套前端面试题收费分享给大家，外面包含了 CSS，大家在筹备面试时，也别忘了看下 CSS 哈。

面试题

CSS

1. 页面渲染时，dom 元素所采纳的布局模型, 可通过 box-sizing 进行设置。依据计算宽高的区域可分为
2.ie 盒模型算上 border、padding 及本身（不算 margin），规范的只算上本身窗体的大小 css 设置办法如下
3. 几种取得宽高的形式
4. 拓展各种取得宽高的形式
5. 边距重叠解决方案(BFC)BFC 原理
6.cssreset 和 normalize.css 有什么区别：
7. 居中办法
8.css 优先确定级
9. 如何革除浮动
10.CSS 开启 GPU 减速
11. 开启 GPU 硬件加速可能触发的问题
12.CSS 中 link 与 @import 的区别
13.CSS 选择器列表优先级及权重
14.display:none 和 visibility:hidden 的区别：
15. 介绍一下 CSS 的盒子模型

HTML

1. 你是怎么了解 HTML 语义化
2. 你用过哪些 HTML5 标签
3.metaviewport 是做什么用的，怎么写？
4.H5 是什么
5.label 标签的作用
6. 行内元素有哪些？块级元素有哪些？空(void) 元素有那
些？
7.a 标签中如何禁用 href 跳转页面或定位链接
8.canvas 在标签上设置宽高和在 style 中设置宽高有什么区别
9. 你做的页面在哪些流览器测试过？这些浏览器的内核别离是什么?
10.iframe 有哪些毛病？

VUE

1.vue.js 的两个外围是什么？
2.vue 的双向绑定的原理是什么？
3.vue 生命周期钩子函数有哪些？
4. 请问 v -if 和 v -show 有什么区别？
5.vue 罕用的修饰符
6.nextTick
7. 什么是 vue 生命周期
8. 数据响应(数据劫持)
9.virtualdom 原理实现
10.Proxy 相比于 defineProperty 的劣势

因为篇幅问题，只展现了一小部分，须要完整版 PDF 的小伙伴们点击这里就能够收费获取啦

最最初还是想说，无论咱们遇到什么样的面试官，被问到什么题，你都要置信你是最棒的！祝小伙伴们在金三银四之际顺顺利利拿到心仪 offer! 喜爱小编这篇文章，请留下你们的点赞留言反对小编，谢谢啦~