4.z-index 有什么作用? 如何使用?
z-index属性适用于定位元素(position属性值为 relative 或 absolute 或 fixed的对象)，用来确定定位元素在垂直于显示屏方向(称为Z轴)上的层叠顺序(stack order)。
z-index值越大，越在最上层。且只有在相同父元素中才能比较。
5.position:relative和负margin都可以使元素位置发生偏移?二者有什么区别?
position:relative 不会影响其他的普通文档流的，普通文档流仍然会在偏移之前的占据的位置后面正常排列。只是视觉上有可能覆盖到普通文档流。
负margin 本身仍然是普通文档流中的一员，实际上位置发生偏移，会影响之后的普通文档流的排列。
6.BFC 是什么？如何生成 BFC？BFC 有什么作用？举例说明
BFC是 Block Format Context 格式化块状上下文规则。
生成BFC的方法。
float:right/left;
overflow:不为visible;
position:absolute/fixed
display:inline-block,table-cell,table-capation
display：table也认为可以生成BFC，其实这里的主要原因在于Table会默认生成一个匿名的table-cell，正是这个匿名的table-cell生成了BFC
BFC规则
内部的Box会在垂直方向上一个接一个的放置
垂直方向上的距离由margin决定。（完整的说法是：属于同一个BFC的两个相邻Box的margin会发生重叠，与方向无关，其中一个元素生成新的BFC就不会再发生重贴。）
每个元素的左外边距与包含块的左边界相接触（从左向右），即使浮动元素也是如此。（这说明BFC中子元素不会超出他的包含块，而position为absolute的元素可以超出他的包含块边界）
BFC的区域不会与float的元素区域重叠
计算BFC的高度时，浮动子元素也参与计算
BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面元素，反之亦然。
可以解决的问题有：
父元素生成BFC就可以包住浮动元素，达到清除浮动的目的，解决浮动元素父元素高度塌陷。
解决外边距合并问题，同处于一个BFC规则下的相邻元素、嵌套元素，只要它们之间没有阻挡（如：边框、非空内容、padding等）就会发生margin重叠。这是只要让其中一个元素生成新的BFC就能解决margin重叠问题。
7.在什么场景下会出现外边距合并？如何合并？如何不让相邻元素外边距合并？给个父子外边距合并的范例.- 只有普通文档流中块框的垂直外边距才会发生外边距合并。
- 合并的情景：
上下相邻
这种情况合并以外边距大者为准，不管有没有外边框。
上下相邻
这种情况合并以外边距大者为准，不管有没有外边框。
如何不让其合并。
对于第一种相邻子元素的margin，可以为第一个元素或者第二个元素加上一个新的BFC外壳，如可以为第一个元素加一个absolute的父元素。
对于第二种可以为父元素创建新的BFC，或者为父元素加上padding或者border.
对于第三种自身合并直接加content就行了。
|
