css

弄清flex-wrap和align-self、align-items、align-content之间的关系，flex-shrink是如何计算的，flex-basis与width/height等关系

引言 通过阅读了Peter-Paul Koch关于研究viewport的三篇系列文章以及stackoverflow上关于viewport的描述之后的meta标签总结

1. FC是什么 2. 介绍BFC、IFC、FFC、GFC 2-1. 它在什么条件下会创建 2-2. 它的布局规则是什么 2-3. 它的使用场景（利用它的特性来完成需求）

transform-origin将当前变换原点(x1，y1，z1)变为(x1+x2，y1+y2，z1+z2)%pxem水平方向取值，相对元素的宽，leftcenterbottom垂直方向取值，相对元素

transitiontransition-property（默认all）指定监听的属性transition-duration过渡动画的时间transition-timing-function（默认li

box盒模型定义参考文章：https://zhuanlan.zhihu.com/p/291489867盒子内部盒子外部content-box（标准盒模型）boxWidth=width+border2+

因此当我们设置border-radius: 100%,很明显相邻的两个切圆的半径之和超过边界框的大小，因此按照它们的比例1 : 1 : 1 :1进行缩小，一直到border-radius:50%，就刚刚好等于边界框的大小，就停止了。所以呈现出来的效果和我们设置的border-r…