之前由于用户端引入Facebook的YOGA库，以及微信小程序学习的起因，对于前台的布局有肯定的理解。书读百遍其义自见，不经常使用的工具还是需要时不时学习，比方Flexbox和Position布局。
在未设置其余任何布局的情况下，网页默认采用流式布局方式。有几点需要注意一下:
块级标签不能嵌套到形内标签的起因是: 块级标签的新开一行的规则并不会改变，所以并没有任何效果
假如要放置在前面，需设置一个较小的值!
弹性布局中对于内部items的方向设置值，主要是会影响主轴的方向。可取值: row 、row-reverse 、column、column-reverse.
main axis: 水平从左至右
main axis: 水平从右至左flex布局主轴默认为水平方向，设置row-reverse时并不是简单的左右偏移，而是变换了主轴的方向。
main axis: 垂直从上至下
main axis: 垂直从下至上设置为column时，相当于把主轴和交叉轴进行了交换，整体布局以垂直方向显示。
决定了主轴方向上items对齐的方式，可取值: flex-start、flex-end、center、space-around、space-evenly和space-between。flex-start、flex-end和center很好了解，以上图中的start和end方向对齐。
左右边距是中间间距的1/2（items之间的间距相等）
space-around间距和边距值相等
space-evenly决定了交叉轴方向的对齐方式，可取值: flex-start、flex-end、center、baseline、stretch。
拉伸到和容器相同的高度，但是前提是: 不能限制item的高度，不然不起作用！
stretch相对布局，相对于元素在流式结构中的位置。可取值: 正数、负数和0.由于可以设置负数和正数，所以bottom: 20px == top: -20px
以图例进行说明:
相对布局关于left与top和单词本身的含义如同有点差异，为什么设置left反而往右边偏移的呢？设置top反而往下方偏移呢？起因就是网页CSS坐标方向:
css坐标方向示例绝对布局，相对于父视图的区域进行绝对布局。假如父视图中没有非static的元素那么就能在整个屏幕中大显身手了；假如存在则只能在父视图的区域内活动。设置元素位置值：left、top、right、bottom，需要注意和relative的差异:
绝对布局这些位置值就等同于单词的含义，距离右边距的偏移量，能设置正数、负数和0.
iOS程序员的前台学习之路，开车了锁死不下车了！
