携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第28天，点击查看活动详情 >
如何实现元素的垂直居中
法一：父元素 display:flex,align-items:center;
法二：元素绝对定位，top:50%，margin-top：-（高度/2）
法三：高度不确定用 transform：translateY（-50%）
法四：父元素 table 布局，子元素设置 vertical-align:center
什么是 BFC
BFC 也就是常说的块格式化上下文，这是一个独立的渲染区域，规定了内部如何布局， 并且这个区域的子元素不会影响到外面的元素，其中比较重要的布局规则有内部 box 垂 直放置，计算 BFC 的高度的时候，浮动元素也参与计算，触发 BFC 的规则有根元素， 浮动元素，position 为 absolute 或 fixed 的元素，display 为 inline-block，table-cell， table-caption，flex，inline-flex，overflow 不为 visible 的元素;
display：table 和本身的 table 有什么区别
display:table 和本身 table 是相对应的，区别在于，display：table 的 css 声明能够让一个 html 元素和它的子节点像 table 元素一样，使用基于表格的 css 布局，是我们能够轻松定 义一个单元格的边界，背景等样式，而不会产生因为使用了 table 那样的制表标签导致 的语义化问题。 之所以现在逐渐淘汰了 table 系表格元素，是因为用 div+css 编写出来的文件比用 table 边写出来的文件小，而且 table 必须在页面完全加载后才显示，div 则是逐行显示，table 的嵌套性太多，没有 div 简洁;
box-sizing 的语法和基本用处
box-sizing 规定两个并排的带边框的框
box-sizing：content-box/border-box/inherit
content-box：宽度和高度分别应用到元素的内容框，在宽度和高度之外绘制元素的内边 距和边框
border-box：为元素设定的宽度和高度决定了元素的边框盒，
inherit：继承父元素的 box-sizing
绘制一条0.5px的线
方法1:采用 border-image 的方式
方法2:采用 transform: scale()的方式
如果有哪里描述不准确或者有问题,欢迎大佬指正!
(≖ᴗ≖)✧
