1.介绍一下标准的css的盒子模型？与ie盒子有什么区别？
（1）有两种盒子，一个是W3C盒子模型，另一个是IE盒子模型
（2）盒模型：内容（content），内边界（padding），边框（border），外边界（margin）
（3）区别：ie的content部分把padding和border算进去了
2.css选择符有哪些，哪些属性可以 继承？
①id选择器（ # myid）
②类选择器（.myclassname）
③标签选择器（div, h1, p）
④伪类选择器（a:hover, li:nth-child）
⑤子选择器 （ul > li）
⑥后代选择器（li a）
⑦相邻选择器（h1 + p）
⑧通配符选择器（ * ）
可继承的样式： font-size font-family color, UL LI DL DD DT;
不可继承的样式：border padding margin width height ;
3.css优先级
优先级就近原则，同权重情况下样式定义最近者为准;
载入样式以最后载入的定位为准;
优先级为: !important > id > class > tag important 比 内联优先级高
4.CSS3新增伪类有哪些？
:after 在元素之前添加内容,也可以用来做清除浮动。
:before 在元素之后添加内容
:disabled 控制表单控件的禁用状态。
:checked 单选框或复选框被选中。
5.如何居中div？如何居中一个浮动元素？如何让绝对定位的div居中？
①居中div
- 给div设置一个宽度，然后设置margin:0 auto
②居中一个浮动元素
- 设置好容器的宽高，在设置容器的外边距
③绝对定位的div居中
- margin: 0 auto; top: 0; left: 0; bottom: 0; right: 0;
6.display有哪些值？说明他们的作用。
①block： 块级元素，像块类型元素一样显示。
②inline-block：像行内元素一样显示，但其内容像块元素一样显示。
③list-item： 像块元素一样显示，并添加样式列表标记。
④table： 此元素会作为块级表格来显示
⑤none：缺省值。象行内元素类型一样显示。
⑥inherit： 继承父元素 display 属性的值
7.CSS3有哪些新特性？
①新增了各种css选择器
②添加了圆角 border-radius
③多列布局
④文字渲染
⑤线性渐变
⑥旋转
8.请解释一下CSS3的Flexbox（弹性盒布局模型）,以及适用场景？
- 该布局模型的目的是提供一种更加高效的方式来对容器中的条目进行布局、对齐和分配空间。在传统的布局下，block布局是把快元素在垂直方向从上到下依次排列；而inline布局则是在水平方向排列。弹性布局没有这样的限制，可以有开发人员自由操作。
9.用css实现三角形
- 把上左右边隐藏
(transparent 是透明色)
#demo{
width: 0;
height: 0;
border-width: 30px;
border-style: solid;
border-color: transparent transparent red transparent ;
}
10.经常遇到浏览器兼容性问题有哪些？原因和解决方法是什么？常用hack的技巧 ？
- png24位的图片在IE浏览器出现背景。解决方法是做成png8.
- 浏览器默认的padding和margin值不一样。解决方法是加一个全局*{padding:0;margin:0;}.
11.li与 li之间看不见的白色间隔原因是什么，有什么解决办法？
- 行框的排列受到中间空白回车等的影响，因为空格也属于字符，会被应用样式占据空间。
- 解决方法：将字符大小设置为0
12.为什么要初始化css？
- 因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没有对css初始化会出现浏览器之间页面的差异性。
13.对BFC规范（块级格式化上下文：block formatting context） 的理解？
- w3c css2.1中的一个概念 ，他就是一个独立容器，决定了元素如何对内容进行定位，以及与其它元素的相互作用
- 一个页面是有很多box组成的，元素类型和display属性 决定了这个box的类型。
- 不同类的box会参与不同的bfc，因此box内的元素会以不同方式渲染，也就是说bfc内部的元素和外部元素不会相互影响。
14.css优化，提高性能的办法？
- 避免使用多类选择符
- 移除空的css规则
- 正确使用display属性，留意以下几点
- display：inline 后面不应该使用 width，height，margin，padding以及float；
- display：inline-block 之后不应该使用float
- display：block 之后不应该使用vertical-align
- display：table 之后不应该使用margin或者float
- 不滥用浮动
- 不声明过多的font-size
- 不在选择符中使用id标识符（考虑到页面重用和耦合性）
- 遵守盒模型规则
15.浏览器是怎样解析CSS选择器的？
- css解析器是从右到左解析的。若从左到右的匹配，发现不符合规则，就会回溯，损失很多性能。若从右往左匹配，先找到所有的最右节点,对于每一个节点，向上寻找其父节点直到找到根元素或者满足条件的匹配规则，则结束这个节点的遍历。
16.什么是cookie隔离？
- 如果静态文件都在放在主域名下，那么静态文件请求的时候都将带有cookie的数据传给server，非常浪费流量，所以不如隔离开。
- 因为cookie有域的限制，因此不能跨域请求，故使用非主要域名的时候，请求头中不会带有cookie数据 ，这样看可以降低请求头的大小，降低请求时间，从而达到降低整体请求延时的目的。
- 同时这种方式不会将cookie 数据传入web server，也减少了web server对cookie的处理分析环节，提高了web server的http请求的解析速度。
来源：https://www.cnblogs.com/chenxi0x0/p/12518965.html