前端面试知识点大全——CSS篇（二）

总纲：前端面试知识点大全

目录

1.如何为有功能限制的浏览器提供网页？

2.有哪些的隐藏内容的方法？

3.栅格系统 (grid system)

3.1 Bootstrap

3.2 Grid布局

4.你用过媒体查询，或针对移动端的布局CSS 吗？

5.如何优化网页的打印样式？

6.在书写高效 CSS 时会有哪些问题需要考虑？

7.使用 CSS 预处理器的优缺点有哪些？

8.如果设计中使用了非标准的字体，你该如何去实现？

9.请解释浏览器是如何判断元素是否匹配某个 CSS 选择器？

10.请描述伪元素 (pseudo-elements) 及其用途

10.1 伪类与伪元素

10.2 区别：

---

1.如何为有功能限制的浏览器提供网页？

优雅降级：Web站点在所有新式浏览器中都能正常工作，如果用户使用的是老式浏览器，则代码会检查以确认它们是否能正常工作。由于IE独特的盒模型布局问题，针对不同版本的IE的hack实践过优雅降级了,为那些无法支持功能的浏览器增加候选方案，使之在旧式浏览器上以某种形式降级体验却不至于完全失效。

渐进增强：从被所有浏览器支持的基本功能开始，逐步地添加那些只有新式浏览器才支持的功能,向页面增加无害于基础浏览器的额外样式和功能的。当浏览器支持时，它们会自动地呈现出来并发挥作用。

2.有哪些的隐藏内容的方法？

display:none；visibility:hidden；overflow:hidden（针对溢出 ）；

3.栅格系统 (grid system)

栅格系统就是将页面等分成固定数量的列与行，然后在每个格子中进行布局设计。

3.1 Bootstrap

目前主流的栅格系统UI框架就是bootstrap。它将页面分成12列，根据屏幕的大小分成lg、md、sm和xs四个等级，用以响应式的适配所有设备。

在后面的章节中会讲到。

3.2 Grid布局

还有一种就是新的布局方式，也称之为grid，样式属性display:grid。可学习下面的链接。

https://www.jianshu.com/p/d183265a8dad

4.你用过媒体查询，或针对移动端的布局CSS 吗？

媒体查询有三个地方可以使用：

1、、