CSS前端面试问题分类整理

2021-01-19 14:00:40

CSS在面试中出现不多,但作为贯通整个前端的必备语言,对CSS的考察能够了解前端面试者的基础,好奇心以及编码习惯等。
早期,面试题多以CSS属性,选择器,继承为基础,IE兼容性、各种布局作为更高级别的前端的筛选。
近几年,Mobile First理念深入人心,快应用,小程序如雨后春笋版崛起,支付方式日趋多样。Flash正式退出历史舞台,CSS在动画和可视化领域大显身手。工程化领域,模块化成为标准,less、sass和postCSS劲头依旧,从三层分离,组件化到CSS原子化,从面向对象到BEM,CSS原子化再被提及。浏览器领域,PC端,IE被Edge取代,Chrome仍旧保持领先,而移动端的前端运行环境却更加碎片化。刚刚摆脱IE6的前端开发者,面临更多样的移动端,不得不在IOS、安卓和各种超级应用入口间兼容,加强性能优化。Flex和Gird布局,让曾经的双飞翼,圣杯变得容易,流式开发,响应式,自适应仍占据web主流,刘海儿屏,水滴屏,挖孔屏,全面屏,不同尺寸,分辨率和DPI的屏幕,仍需要前端多花心思布局。CSS3获得了广泛兼容,CSS4蓄势待发。
面对如此发展快速的前端,很多开发者直呼“学不动”。其实,很多概念,如原子化,很早就有,今天能够再次被推广,得益于它能够大幅提高CSS的复用度,解决大型项目随功能增多,CSS日趋庞大,维护过于困难的问题。那么,我们就一定要在大型项目中使用它吗?答案是否定的。具体还要结合项目来看。
作为前端,我们常常面临各种技术栈的选择,具有良好的技术应用能力,能够快速上手,解决问题固然重要,但作为考核前端的面试,对比会什么,面试官通常更重视面试者的学习能力和好奇心。愿意学习,并且擅于学习的前端开发者,在实际工作中,更容易适应工作环境,上手业务。
无论前端如何发展,概念,设计、布局、原理、性能、工程化和规范,始终对前端非常重要,本文将从这些话题出发,整理CSS常见面试题。
回答这些题目并不难,重要的是理解考察点,适当拓展或深入,知其然更知其所以然,依然以CSS原子化为例:

什么是CSS原子化?
及格的回答是:定义
有经验的回答是:定义 背景 解决了什么问题 怎么解决的
几乎满分的回答是:与组件化等对比 辩证地说明 CSS原子化 应用场景 谈谈自己在项目中的使用和体会

CSS 概念

CSS 设计

CSS 实践

CSS 原理

CSS 性能

CSS 工程

CSS 方法论

CSS 综合

115210
小宇
ShopXO插件 ▶力扣 ▶Github ▶M站