CSS 面试题

huguangju2024年11月21日大约 1 分钟

关键点

盒模型、选择器、伪类和伪元素
BFC、居中布局、Flex/Grid、清除浮动、CSS画图、Retina 1px
三栏布局（圣杯、双飞翼）、响应式布局、rem自适应

面试题

布局

什么是BFC？BFC的布局规则是什么？如何创建BFC（触发条件）？
水平垂直居中元素有哪些方案？
浮动布局的优缺点是什么？清除浮动有哪些方式？
两个display：inline-block元素放一起会产生空白间隙？为什么？如何解决？

应用

实现 div 垂直居中，左右10px，高度始终为宽度的一半
创建三角形的原理是什么？
实现 loading 加载动效
多列等高如何实现？
实现常用布局（三栏、圣杯、双飞翼、吸顶），可以说出多种方式并理解其优缺点
Retina 屏幕的 1px 像素，如何实现？

高级

图片瀑布流布局实现原理
CSS 优化、提高性能的方式有哪些？

参考