1、简述一下你对HTML语义化的理解
1）用正确的标签做正确的事情。
2）html语义化让页面的内容结构化，结构更清晰，便于对浏览器、搜索引擎解析;
3）即使在没有样式CSS情况下也以一种文档格式显示，并且是容易阅读的;
4）搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重，利于SEO;
5）使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解
2、Doctype作用？标准模式与兼容模式之间区别？
<!DOCTYPE>声明位于位于HTML文档中的第一行，处于 <html>标签之前，告知浏览器的解析器用什么文档标准解析这个文档
DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现
标准模式的排版 和JS运作模式都是以该浏览器支持的最高标准运行
在兼容模式中，页面以宽松的向后兼容的方式显示,模拟老式浏览器以防止站点无法工作
3、什么是盒模型？你是怎么理解的
简单的说页面是由若干个盒模型（BOX）堆砌起来的，可以说每个HTML元素就是一个盒模型
盒模型由外到内包括边距(margin)、边框（border）、填充(padding)、内容(content)
盒子模型有两种分别是W3C标准模型和IE模型
不同之处：
标准模型宽高是指content，不包括padding和border
IE模型的宽高是指content+padding+border的总宽高
4、谈谈对BFC的理解
BFC：块格式化上下文(Block Formatting Context)
BFC 是一个独立的布局环境,可以理解为一个容器,在这个容器中按照一定规则进行物品摆放,并且不会影响其它环境中的物品
BFC的特性：
1）bfc 是一个独立的容器，容器内子元素不会影响容器外的元素
2）bfc的区域不会与float的元素区域重叠
3）计算bfc的高度时，浮动元素也参与计算
4）垂直方向上的距离由margin决定
5）内部的Box会在垂直方向上一个接一个的放置
以下条件会形成BFC：
1）浮动元素 float:left | right | inherit（none除外）
2）position:absolute 或 fixed 定位
3）display:inline-block | inline-flex | table-cell
4）overflow:hidden | auto | scroll (visible除外)
5、CSS选择符有哪些？哪些属性可以继承？
id选择器（ # myid）
类选择器（.myclassname）
标签选择器（div, h1, p）
相邻选择器（h1 + p）
子选择器（ul > li）
后代选择器（li a）
通配符选择器（ * ）
属性选择器（a[rel = "external"]）
伪类选择器（a:hover, li:nth-child）
可继承的样式： font-size font-family color, ul li dl dt dd
不可继承的样式：border padding margin width height
6、CSS优先级算法如何计算？
优先级就近原则，同权重情况下样式定义最近者为准
载入样式以最后载入的定位为准
优先级为: !important > id > class > tag important 比 内联优先级高
7、你理解的伪类与伪元素
伪类：用于向某些选择器添加特殊的效果。比如span:first-child{}
伪元素：用于将特殊的效果添加到某些选择器。比如span:before{}
伪类只要不是互斥可以叠加使用
伪元素在一个选择器中只能出现一次，并且只能出现在末尾
伪类与伪元素优先级分别与类、标签优先级相同
它们的本质区别：是否抽象创造了新元素
8、display有哪些值？box-sizing 常用的属性有哪些？说明他们的作用
block 像块类型元素一样显示。
none 缺省值。像行内元素类型一样显示。
inline-block 像行内元素一样显示，但其内容像块类型元素一样显示。
list-item 像块类型元素一样显示，并添加样式列表标记。
table 此元素会作为块级表格来显示
inherit 规定应该从父元素继承 display 属性的值
box-sizing: content-box; // 默认的标准(W3C)盒模型元素效果
box-sizing: border-box; // 触发怪异(IE)盒模型元素的效果
box-sizing: inherit; // 继承父元素 box-sizing 属性的值
9、什么是外边距重叠？ 重叠的结果是什么？
外边距重叠就是 margin-collapse
相邻的两个盒子（可能是兄弟关系也可能是祖先关系）的外边距可以结合成一个单独的外边距。 这种合并外边距的方式被称为折叠
折叠结果遵循下列计算规则：
1）两个相邻的外边距都是正数时，折叠结果是它们两者之间较大的值
2）两个相邻的外边距都是负数时，折叠结果是两者绝对值的较大值
3）两个外边距一正一负时，折叠结果是两者的相加的和
10、请列举几种隐藏元素的方法
1）display: none; 元素会变得不可见，并且不会再占用文档的空间
2）visibility: hidden; 只是简单的隐藏某个元素，但是元素占用的空间还存在
3）opacity: 0; 设置0可以使一个元素完全透明
4）position: absolute; 设置一个很大的 left 负值定位，使元素定位在可见区域之外
5）transform: scale(0); 将一个元素设置为缩放无限小，元素不可见 原来位置将被保留
11、你对line-height是如何理解的？
line-height 指一行字的高度，包含了字间距，实际上是下一行基线到上一行基线距离
一个容器没有设置高度，那么撑开容器高度的是 line-height 而不是容器内的文字内容
把 line-height 值设置为 height 一样大小的值可以实现单行文字的垂直居中
line-height和height都能撑开一个高度，height会触发 haslayout，而line-height不会
（未完待续）