css布局中的BFC问题

1. 什么是边距重叠？

2. 什么情况下会发生边距重叠？

3. 如何解决边距重叠？

边距重叠： 两个box如果都设置了边距，那么在垂直方向上，两个box的边距会发生重叠，以绝对值大的那个为最终结果显示在页面上。

有两种边距重叠的情况：

1. 父子关系的边距重叠

父子关系，如果子元素设置了外边距，在没有把父元素变成BFC的情况下，父元素也会产生外边距

给父元素添加 overflow：hidden

这样父元素就变为 BFC，不会随子元素产生外边距

2. 同级兄弟关系的重叠：

同级元素在垂直方向上外边距会出现重叠情况，最后外边距的大小取两者绝对值大的那个

可通过添加空元素或伪类元素，设置overflow:hidden;解决margin重叠问题

2. 回答边距重叠—BFC

什么是BFC？

BFC就是“块级格式化上下文”的意思，BFC是一块独立的布局环境，保护其中内部元素不收外部影响，也不影响外部。本身BFC是一种css的布局方式，只是我们可以利用它来解决外边距折叠的问题，BFC并不是专门用来解决这个问题而创的；

如何触发BFC？

在box属性值为这些的情况下，都会让所属的box产生BFC。

• overflow: auto/ hidden;

• position: absolute/ fixed;

• float: left/ right;

• display: inline-block/ table-cell/ table-caption/ flex/ inline-flex

也可以用排除法：

overflow的值不是visible；

position的值不是static或relative

float的值不是none

display的值是inline-block 或 table-cell 或 flex 或 table-caption 或

inline-flex

BFC的原理？(面试可不说，但要理解)

前端资料汇总

我一直觉得技术面试不是考试，考前背背题，发给你一张考卷，答完交卷等通知。

首先，技术面试是一个 认识自己 的过程，知道自己和外面世界的差距。

更重要的是，技术面试是一个双向了解的过程，要让对方发现你的闪光点，同时也要 试图去找到对方的闪光点，因为他以后可能就是你的同事或者领导，所以，面试官问你有什么问题的时候，不要说没有了，要去试图了解他的工作内容、了解这个团队的氛围。
找工作无非就是看三点：和什么人、做什么事、给多少钱，要给这三者在自己的心里划分一个比例。
最后，祝愿大家在这并不友好的环境下都能找到自己心仪的归宿。