怎么理解盒子模型
答案解析
html的每个元素都可以理解成是一个盒子，包含内容有margin、border、padding、content4个属性。盒子模型常见有两种w3c标准模型，IE模型。其中标准模型：width是指的content的宽度，而IE模型是指的content+padding+border的总和。
在开发过程中我们会通过通配符+box-sizing,将元素的标准统一，解决不同浏览器的兼容问题，box-sizing可选属性：content-box（content）、border-box（content+border）、padding-box（content+border+padding）。
拓展知识点margin属性：
行内元素是没有上下外边距的，只有左右外边距，所以尽量不要设置行内元素的内外上下边距，设计宽高也是无效的两个相邻的块级元素一个设置了margin-bottom、另一个设置margin-top的时候，会发生外边距塌陷。两个元素之间的margin值会合并，margin值最终取较大值。嵌套块元素垂直边距合并，当父级元素没有设置border、padding的情况下，父子元素的margin边距会合并，其取值为较大值css3的新特性
答案解析
常用css3新特性：动画属性animation、弹性布局盒子、颜色设置支持rgba、媒体查询
media、盒子属性定义、形状转换transform、text的相关属性（超出内容换行、超出内容展示形式）div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}复制代码css3的position
答案解析
说一下css3的选择器有那些，以及优先级
答案解析：
css的选择器有：标签、类、ID、全局、组合、后代、兄弟、伪类、伪元素选择器。
css的优先级：
!important行内样式ID选择器类选择器标签通配符继承浏览器默认属性复制代码css选择器的权重计算规则
第一等：代表内联样式，如：style=,权值为第二等：代表ID选择器，如：#content,权值为第三等：代表类、伪类、属性选择器，如：.content权值第四等：代表标签选择器和伪元素选择器，如div、p，权值通配符、子选择器、相邻选择器。如、、+权值为继承样式无权值、!important最高权值css选择器符号表示
,选择器分组，每组的样式一致*通配符，表示可以与任何元素匹配#ID选择器[]属性选择器，例如：[href],[title]divp定义后代选择器divp定义子元素选择器p+li相邻兄弟选择器，两者有相同元素，选择的是前一个选择器相邻的后一个选择器讲一下css3的弹性布局
答案解析：
弹性布局是css3的新属性，是一种当页面需要去适应不同类型和屏幕大小时确保元素能够具有恰当行为的布局。作用是能够提供一个有效的帮助我们管理一个容器中子元素的排列、对齐和分配空白空间。
弹性布局父元素属性
flex-direction：row/row-reserve/column/column-reserve(排序方式)flex-wrap:nowrap/wrap/wrap-reserve（超出是否换行）align-items:flex-start/center/flex-end/baseline（纵向对齐方式）justify-center:flex-start/center/flex-end/baseline（横向对齐方式）弹性布局子元素属性
order:改变排序顺序的位置，默认为0，从小到大排flex:flex-growflex-shrinkflex-basis(元素占比元素压缩量初始元素长度）BFC是什么?怎么触发BFC?
答案解析：
BFC是指块级格式化上下文，决定了元素如何对其内容进行定位、以及与其他元素的关系和相互作用。可以用来解决子元素浮动，父元素的高度没有了、两栏布局右栏不自适应、垂直方向上两元素边距有误等情况。
触发情况：
float不为noneposition不为relative或者staticoverflow为auto、scroll或者hiddendisplay为inline-block触发后作用
解决浮动·子元素导致父元素塌陷实现两栏自适应的问题外边距垂直方向重合的问题都是利用触发BFC，使得元素有自己独立空间
如何清除浮动？
答案解析：
清除浮动是指的是父元素中的子元素设置float导致父元素的高度为0的情况
解决方案
父元素设置属性为：overflow:hidden(实质是触发BFC)父元素中增加一个新的元素，添加属性clear:both父元素增肌伪类::after，设置{content:,clear:both}css实现水平垂直居中
答案解析：
块级元素未知宽高情况下
利用弹性布局.parent{diplay:flex;justify-content:center;//实现横轴align-items:center;}复制代码使用绝对定位.child{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;}复制代码利用transform属性+绝对定位.child{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);//根据本身元素}复制代码使用table表格法.parent{display:table;width:px;height:px;}.child{display:table-cell;vertical-align:middle;text-align:center;}复制代码已知宽高实现水平垂直居中
使用line-height与height相同、以及text-align:center使用绝对定位+margin负值偏移css3的动画属性
答案解析
animationanimation:animation-nameanimation-durationanimation-timing-functionanimation-delayanimation-iteration-count；分别表示动画名（与
keyframes对应）、动画持续时间、动画执行速度、动画延迟时间、动画循环规律复制代码transform1)rotate旋转transform：rotate(20deg)//旋转角度transform-origin：50%50%//定义旋转基点2)translate移动translate:translate(20px,10px)translate:translateX(20px)translate:translateY(30px)3)scale缩放transform-origin：50%50%//定义缩放基点translate:scale(20px,10px)translate:scaleX(20px)translate:scaleY(30px)复制代码因为可能有些浏览器不兼容这些属性，所以需要加上浏览器前缀：-wekit-、-ms-、-moz-、-o-:谷歌、IE9、火狐、Opera页面导入样式时，使用link和
import有什么区别？答案解析：
link是XHML标签，除了加载css文件，还可以加载RSS得其他事务，而
import只能加载csslink无浏览器兼容问题，import在低版本浏览器下支持link标签引用css文件的时候在页面载入同时加载；import只能等页面完全载入以后加载z-index、层叠属性z-index属性的局限性：只能在定位元素上有效果判断元素在Z轴上的堆叠顺序，不仅仅是直接比较两个元素的z-index值的大小，堆叠顺序和层叠上下文、层叠等级共同决定。层叠上下文的产生方法有：设置定位元素position且非static值并设置z-index属性的具体数值、transform属性值不是none、父元素的display属性值为flex,子元素z-index不为autocss的flex的属性分别表示什么
flex:flex-growflex-shrinkflex-basis//默认值flex:01auto复制代码flex-grow:默认0，定义子元素相对于其他子元素在元素分配完还有剩余空间情况下的放大比例flex-shrink:默认1，定义子元素相对于其他子元素在父元素空间不足时相对于其他子元素的缩放比例flex-basis：默认为autocss会阻塞渲染吗？
css不会阻塞dom树的解析css会阻塞dom树的渲染css加载会阻塞后面js的执行原因如：浏览器渲染页面的过程分析
结构伪类选择器有哪些
参考文章
less和scss、以及css的区别
less和scss都是属于css的预处理器。
用来为css增加一些编程的特性，无需考虑浏览器的兼容性问题同时扩展了
import指令的能力，通过编译环节将切分后的文件重新合并一个大文件。这一方面解决了大文件不便维护的问题，另一方面也解决了一堆文件在加载时的性能问题例如在css使用变量、简单的程序逻辑、函数等等在编程语言中的一些基本技巧，可以让我们的css更加简洁、适应性更强，代码直观box-shadow属性详解
box-shadow：offset-xoffset-yblurspreadcolorposition//从左到右表示：x轴偏移量、y轴偏移量、阴影的模糊半径、阴影扩展半径、颜色、阴影位置（默认外阴影，设为inset则表示内阴影）复制代码伪类和伪元素的区别
伪元素是用来创建一些不存在原有dom结构树中的元素。例如::before、::after在一些存在的元素添加内容，会以具体的UI显示出来，但是这些内容不会出现在dom伪类是表示已存在的某个元素处于某种状态，但是通过dom树又无法表示出不同状态下的样式。
区别：伪元素的操作对象是新生的元素，而不是原来dom结构里就存在的；而伪类的操作对象是原来dom结构就存在的元素
css中那些属性可以继承
字体系列font-familyfont-sizefont-style文本系列属性text-indent:文本缩进text-align:文本水平对齐line-height:行高元素可见性visibility:控制元素的显示隐藏列表布局属性list-style:列表风格光标属性