前端面试题vue—( BFC 地址栏输入网址敲回车会发生什么 )

一、什么是BFC？什么情况下触发BFC

• 什么是BFC
  BFC(块级格式化上下文)
  是Web页面的可视化CSS渲染的一部分，是布局过程中生成块级盒子的区域，也是浮动元素与其他元素的交互限定区域
• 哪些元素会具有BFC的条件？
  display 属性为 block, list-item, table 的元素，会产生BFC.
• 什么情况下可以让元素产生BFC
  以上盒子具有BFC条件了，就是说有资质了，但是怎样触发才会产生BFC，从而创造这个封闭的环境呢？
  同样，要给这些元素添加如下一种属性就可以触发BFC。
  float属性不为none
  position为absolute或fixed
  display为inline-block, table-cell, table-caption, flex, inline-flex
  overflow不为visible。
  overflow：hidden 防止外边距合并的问题
• BFC布局规则特性：
  1.在BFC中，盒子从顶端开始垂直地一个接一个地排列.
  2.盒子垂直方向的距离由margin决定。属于同一个BFC的两个相邻盒子的margin会发生重叠
  3.在BFC中，每一个盒子的左外边缘（margin-left）会触碰到容器的左边缘(border-left)（对于从右到左的格式来说，则触碰到右边缘）
• BFC总结
  BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素。反之也如此。包括浮动，和外边距合并等等，因此，有了这个特性，我们布局的时候就不会出现意外情况了

二、输入url敲回车发生了什么？

1. 浏览器会开启一个线程来处理这个请求，同时在DNS服务器上开启查询，使浏览器获得请求对应的ip
2. 浏览器与服务器通过三次握手来建立连接，第一次握手是客户端向服务器发送请求等待服务器确认，第二次握手是
   服务器收到客户端请求，并向客户端发送状态，第三次握手是客户端收到服务器的确认，建立连接完成三次握手
3. 客户端与服务器建立连接，并发送请求数据，服务器在内找到对应资源返回给客户端，返回200响应状态获取数据成功
   四次挥手：第一次挥手是客户端请求完数据后，发送请求断开连接
   第二次挥手是服务器收到请求
   第三次挥手是服务器结束数据传输
   第四次握手是客户端接收服务器的响应