本文涵盖了CSS面试中常见的20个问题，包括CSS选择器的优先级、link与@import的区别、隐藏元素的方法、em/px/rem单位的对比、块级元素水平居中、定位方式、z-index的理解、层叠上下文、清除浮动、CSS Sprites原理、媒体查询的概念、盒模型解析、标准盒模型与怪异盒模型的差异、BFC（Block Formatting Context）的解释、translate与定位的使用场景、伪类与伪元素的区别、Flex布局的介绍以及CSS动画和过渡的运用。同时，文章也涉及了JavaScript基础，讲解了JS的定义和原型链的工作机制。
CSS
1. CSS选择器的优先级是怎样的？
CSS选择器优先级最高到最低顺序为：
1.id选择器（#myid）
2.类选择器（.myclassname）
3.标签选择器（div,h1,p）
4.子选择器（ul < li）
5.后代选择器（li a）
6.伪类选择（a:hover,li:nth-child）
最后，需要注意的是：
!important的优先级是最高的，但出现冲突时则需比较”四位数“;
优先级相同时，则采用就近原则，选择最后出现的样式;
继承得来的属性，其优先级最低。
2. link和@import的区别？
1.从属关系区别: @import 是 CSS 提供的语法规则，只有导入样式表的作用； link 是HTML提供的标签，不仅可以加载 CSS 文件，还可以定义 RSS、rel 连接属性等。
2.加载顺序区别: 加载页面时， link 标签引入的 CSS 被同时加载； @import 引入的 CSS 将在页面加载完毕后被加载
3. 有哪些⽅式（CSS）可以隐藏⻚⾯元素？
1,display:none 2.overflow:hedden 3.可以通过将透明度调结为0（opacity: 0;），完全透明状态来达到隐藏页面元素的效果。
4. em\px\rem区别？
1.px为固值单位像素，浏览器最小的显示单位
2.em:相对单位，以父元素的字号为标准计算，父元素字体大小的多少倍“嵌套中都使用此单位会有逐级相乘的状态”。
3.rem:相对单位，以跟标签html的字号为标准计算，rem不会受上级元素的字号影响。
5. 块级元素⽔平居中的⽅法？
1
扫一扫
671
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
