浮动后，行内元素不会成为块状元素，但是可以设置宽高。行内元素要想变成块状元素，占一行，直接设置display:block;。但如果元素设置了浮动后再设置display:block;那就不会占一行。
19、在网页中的应该使用奇数还是偶数的字体？为什么呢？偶数字号相对更容易和 web 设计的其他部分构成比例关系
20、::before 和 :after中双冒号和单冒号 有什么区别？解释一下这2个伪元素的作用单冒号(:)用于CSS3伪类，双冒号(::)用于CSS3伪元素
用于区分伪类和伪元素
21、如果需要手动写动画，你认为最小时间间隔是多久，为什么？（阿里）多数显示器默认频率是60Hz，即1秒刷新60次，所以理论上最小间隔为1/60＊1000ms ＝ 16.7ms
22、CSS合并方法避免使用@import引入多个css文件，可以使用CSS工具将CSS合并为一个CSS文件，例如使用Sass\Compass等
23、CSS不同选择器的权重(CSS层叠的规则)！important规则最重要，大于其它规则
行内样式规则，加1000
对于选择器中给定的各个ID属性值，加100
对于选择器中给定的各个类属性、属性选择器或者伪类选择器，加10
对于选择其中给定的各个元素标签选择器，加1
如果权值一样，则按照样式规则的先后顺序来应用，顺序靠后的覆盖靠前的规则
24、列出你所知道可以改变页面布局的属性position、display、float、width、height、margin、padding、top、left、right、`
25、CSS在性能优化方面的实践css压缩与合并、Gzip压缩
css文件放在head里、不要用@import
尽量用缩写、避免用滤镜、合理使用选择器
26、CSS3动画（简单动画的实现，如旋转等）依靠CSS3中提出的三个属性：transition、transform、animation
transition：定义了元素在变化过程中是怎么样的，包含transition-property、transition-duration、transition-timing-function、transition-delay。
transform：定义元素的变化结果，包含rotate、scale、skew、translate。
animation：动画定义了动作的每一帧（@keyframes）有什么效果，包括animation-name，animation-duration、animation-timing-function、animation-delay、animation-iteration-count、animation-direction
27、base64的原理及优缺点优点可以加密，减少了http请求
缺点是需要消耗CPU进行编解码
28、几种常见的CSS布局 流体布局 .left { float: left; width: 100px; height: 200px; background: red; } .right { float: right; width: 200px; height: 200px; background: blue; } .main { margin-left: 120px; margin-right: 220px; height: 200px; background: green; } <div> <div></div> <div></div> <div></div> </div> 圣杯布局 .container { margin-left: 120px; margin-right: 220px; } .main { float: left; width: 100%; height:300px; background: green; } .left { position: relative; left: -120px; float: left; height: 300px; width: 100px; margin-left: -100%; background: red; } .right { position: relative; right: -220px; float: right; height: 300px; width: 200px; margin-left: -200px; background: blue; } <div> <div></div> <div></div> <div></div> </div> 双飞翼布局 .content { float: left; width: 100%; } .main { height: 200px; margin-left: 110px; margin-right: 220px; background: green; } .main::after { content: ''; display: block; font-size:0; height: 0; zoom: 1; clear: both; } .left { float:left; height: 200px; width: 100px; margin-left: -100%; background: red; } .right { float: right; height: 200px; width: 200px; margin-left: -200px; background: blue; } <div> <div></div> </div> <div></div> <div></div> 29、stylus/sass/less区别均具有“变量”、“混合”、“嵌套”、“继承”、“颜色混合”五大基本特性
Scss和LESS语法较为严谨，LESS要求一定要使用大括号“{}”，Scss和Stylus可以通过缩进表示层次与嵌套关系
Scss无全局变量的概念，LESS和Stylus有类似于其它语言的作用域概念
Sass是基于Ruby语言的，而LESS和Stylus可以基于NodeJS NPM下载相应库后进行编译；
30、postcss的作用