浮动元素有什么特征？对父容器、其他浮动元素、普通元素、文字分别有什么影响?
- 浮动元素的特征，对普通元素的影响：一个元素浮动后会脱离普通流，文本图片会环绕这个浮动元素。行内元素会看见浮动元素，会环绕这个浮动元素，背景和边框不受影响。如果块级元素在文档流中是在浮动元素之后那么他的背景和边框会看不到浮动元素，会延伸到浮动元素之后，被浮动元素覆盖，块级元素内的匿名行盒（文本）会看见浮动元素，然后环绕它。文档流块级在浮动之前那么浮动会被挤下去，背景和边框不受影响。
- 浮动元素对于父容器的影响是会导致父容器高度塌陷，因为一个元素浮动之后会导致父元素看不见它，认为里面没有东西。
- 对于其他浮动元素，按照浮动的方向和渲染的顺序，如果全部向左浮动，那么第二个浮动的元素会和第一个浮动的元素并排在一行，如果宽度不够则会被挤下去，如果这时元素高度不一致，被挤下去的元素会被卡住。
-
对文字的影响，如果是浮动自身内部文字，则按照正常排列显示，外部文字则会围绕着浮动元素排列。
块级在文档流之后
块级在文档流之前
行内元素和浮动
清除浮动指什么? 如何清除浮动? 两种以上方法
- 清除浮动是指的：在非IE浏览器中，在父容器内如果存在浮动元素，且父容器高度为auto，那么浮动元素会溢出，导致容器高度塌陷，清除浮动就是在浮动元素后增加一个看不见的非浮动元素已撑开容器高度。
- 方法1：在HTML中在父容器中最后浮动的标签之后添加一个块级标签添加class属性为 {clear:both}
- 方法2 ：设置一个伪元素，添加一个伪元素属性为.class::after{ content:" "; display: block;clear:both'}把这个class添加到父容器上. 添加.class { *zoom:1;}兼容IE6/7触发haslayout。
- 方法3 ：利用BFC计算高度包括浮动元素，设置父容器属性形成BFC，例如overflow：hidden.
有几种定位方式，分别是如何实现定位的，参考点是什么，使用场景是什么？
- 定位属性有4种：
- position: static(默认),
- 相对定位（relative不脱离普通流）：参考点为自身未定位之前的位置，使用场景：当需要偏移位置但是不想脱离普通流时。
- 绝对定位（absolute脱离普通流）：参考点为相对于最近的非 static祖先元素元素定位，使用场景：一般在一些小部件需要移动的时候使用，或者实现一些元素居中，弹出窗居中，菜单下拉覆盖等等。
- 固定定位（fixed脱离普通流）：参考点为浏览器视窗，使用场景：需要固定某一部件始终在浏览器中显示的时候。
z-index 有什么作用? 如何使用?
- z-index在CSS中相当于z轴，决定在浏览器上的显示先后，z-index只能在定位元素中使用，数值越高越靠前覆盖数值低的。使用方法：z-index: 1; position: relative;
position:relative和负margin都可以使元素位置发生偏移?二者有什么区别
- position:relative 会占据自身本来的位置，不会导致回流，但会重绘。形态上移动。
- 负数margin则会导致重绘制，回流，不占据之前的文档流位置。
网友评论