css面试题

1、display：none与visibility：hidden的区别

他们两者都能让元素不可见。

• display：none是元素从渲染树中消失，渲染时不占据任何空间，而visibility：hidden在渲染时占据空间，只是设置内容不可见。
• display属性会造成文档重排，而visibility属性只是会让元素重绘。
• display属性是非继承属性，由于子孙结点从渲染树中消失，所以设置子孙字节属性也不可见，而visibility属性是继承属性，通过设置子孙结点的visibility属性为visible则可见。

2、谈谈重排（回流）和重绘

• 当元素的尺寸、位置或某些属性发生变化时，浏览器重新渲染文档的过程叫做重排。比如改变窗口的大小，改变元素内容，改变元素位置等。
• 而重绘就是当元素样式的改变不会影响元素在文档流中的位置，比如改变颜色、背景颜色等，浏览器只是把新的样式赋予元素并进行绘制。
• 对于性能来讲，回流要比重绘的代价更高，重绘不一定造成回流，而回流一定会造成重绘。

3、谈谈BFC的理解

BFC就是块级格式化上下文,是一个独立的布局环境。创建BCF的方法有浮动元素float不等于none，绝对定位，overflow不等于visible，display为inline-block等。BFC的典型应用有避免外边距重叠和解决高度塌陷。

外边距重叠就是两个相邻盒子的垂直外边距相遇时，真正的外边距等于两个发生折叠外边距的较大者。通过