目录
display:none; 和visibility:hidden;的区别是什么?
display:none; 彻底消失,释放空间。能引发页面的reflow回流(重排)。
visibility:hidden; 就是隐藏,但是位置没释放,好比opacity:0; 不引发页面回流。
opacity:0;将元素的透明度设置为 0,以此来实现元素的隐藏。元素在页面中仍然占据空间,并且能够响应元素绑定的监听事件。
CSS 优先级
!important > 内联样式 > id选择器 > 类选择器 > 标签选择器 > 通配符
如何触发BFC,以及BFC的作用
1、 定义:块级格式化上下文,内部的Box会在垂直方向,从顶部开始一个接着一个地放置。Box垂直方向的距离由margin(外边距)决定,属于同一个BFC的两个相邻Box的margin会发生重叠。独立的渲染区域,不会影响边界外的元素
2、 形成的条件:a.浮动 b. 非静态定位,c. overflow:hidden d. display:inline-block、block、table-cell、flex、table-caption或者inline-flex
3、 解决的问题:a. 浮动元素重叠 b. 父元素高度塌陷 b. margin重叠
作用:避免margin重叠;清除浮动。
IFC
1、行内格式化上下文,内部的Box会在水平方向,从含块的顶部开始一个接着一个地