1.实现一个水平垂直居中布局
-
使用flex布局：水平方向
justify-content:center，垂直方向align-items:center -
使用绝对定位：设置
position:absolute; top:50%; left:50%;然后设置margin-left:-50%; margin-top:-50%;或者translateX:-50%; translateY:-50%; -
水平居中可以设置左右
margin:auto; -
对于文本可以设置
text-align:center;水平居中，设置line-height等于父容器高度实现单行文本垂直居中
2.文本多行超出省略号
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
3.CSS盒子模型
box-sizing：border-box和content-box
4.CSS几种定位的规则、定位参照物、对文档流的影响
static：默认，没有定位，元素正常出现在文档流中
relative：相对于元素在文档流中的正常位置进行定位，不脱离文档流
absolute：相对于第一个非static的父元素进行定位，脱离文档流
fixed：相对于浏览器窗口进行定位，脱离文档流
sticky：在浏览器可视区域内类似于relative定位，滚动到可视区域外类似于fixed定位，通常用来做吸顶效果
5.CSS预处理器和后处理器
CSS预处理器可以为CSS提供一些编程语言所具有的特性，如变量，嵌套，混合，继承等，可以提升开发效率
最常用的三种sass，less，stylus
CSS后处理器可以对CSS进行处理，最终生成CSS的预处理器，属于广义上的预处理器。常用的有AutoPrefixer，和CSS压缩工具
6.CSS模块化方案
-
每个页面的根节点设置唯一的类名，然后通过根类名+后代选择器的方式实现样式在每个页面内的私有化，只适合小型项目
-
vue中的scoped方案，给每个模块生成一个唯一的属性值，然后将这个属性值添加到模块内的每一个节点上，再配合属性选择器实现样式在模块内的私有化。 但是这种方案是有一定缺陷的，内部样式可能会被其他外部样式干扰
-
使用CSS Modules方案，通过js来维护CSS中类名的唯一映射值，简单来说就是通过webpack等打包工具将类名编译为一个唯一哈希字符串，并维护它们之间的映射关系
