MisShop居中效果实现技巧

居中：分水平居中，垂直居中。

需求环境：在大量的页面布局中，其显示效果经常需要一个元素相对于其父元素水平/垂直居中。而水平居中的使用需求最多。以水平居中为例。

DOM原理解释：
情况一：一段文字在一个dom中的水平位置。
（MisShop的默认控件中的文字，在默认控件中水平位置）
情况二：一个dom在父dom中的位置。
（MisShop的任意控件，在其父控件中的位置或者包裹层中的位置）

实现思路：
1、这个单元格是否有包裹层。如果有包裹层，包裹层占父控件的大小。
比如网格布局/表格布局/弹性布局中，默认有包裹层，那么单元格样式配置中的分栏宽度/分栏偏移，就是先决定包裹层的宽度及其位置。
2、这个单元格的宽度占比，在单元格样式中配置。
如果有包裹层，那么这个宽度就是相对于包裹层的
如果没有包裹层，那么这个宽度就是相对于父控件的
3、选择合适的配置，实现居中效果。

MisShop居中设置：
1、工具条中水平居中：
a、在表格/网格布局容器/弹性布局容器下，以及设置包裹层的控件，此功能用于设置控件在包裹层中的居中。
b、默认控件，设置文字居中
2、单元格样式-->包裹层中：
在单元格具备包裹层的情况下，可设置控件水平居中
3、单元格样式-->布局-->外边距(左)/右边距(右)：
在单元格不具备包裹层的情况下，当设置外边距(左)/右边距(右)均为自动的情况下，
可设置控件在其父控件中的水平对齐
4、单元格样式-->xx容器元素-->分栏宽度/分栏偏移：
在弹性布局中，或者div容器下设置有包裹层的控件，
当设置分栏偏移，分栏宽度，计算后的右边空余相等时，也可实现水平居中