如何快速学会flex布局
<h5>简要描述</h5>
<ul>
<li>
<p>强大的flex布局，可以适合任意的前端页面布局，该布局容器自带了内边距， 可以在右侧的colorUI中删除，一般情况可以不删除</p>
</li>
<li>怎样学会使用flex布局，flex布局有以下特性：</li>
</ul>
<h5>水平对齐方式，先拖入一个flex容器 并拖入头像组件，文字组件，和图标组件到该容器中，水平方向默认的话对齐向左对齐</h5>
<p><img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=b8097b386102dd8f3a413ab09ad7e0aa&amp;file=file.png" alt="" /></p>
<h5>选择了右对齐方式后，flex布局的元素都向右边对齐了</h5>
<p><img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=9b8e2c3f17c7a04f5543839fd041c005&amp;file=file.png" alt="" /></p>
<h5>水平方向选择了中间对齐方式后，flex布局的元素都向中间对齐了</h5>
<p><img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=104f1b3e0188621f09328b20e507ed5f&amp;file=file.png" alt="" /></p>
<h5>水平方向选择了中分对齐方式后，flex布局的元素的位置都平均分布了，元素保持相等的距离</h5>
<p><img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=dc19247ecec56dcf1a1d5a9f46d3821c&amp;file=file.png" alt="" /></p>
<h5>水平方向选择了中分对齐方式后，flex布局的元素的位置都平均分布了，元素保持相等的距离</h5>
<p><img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=dc19247ecec56dcf1a1d5a9f46d3821c&amp;file=file.png" alt="" /></p>
<h5>水平方向选择了两边对齐方式后，flex布局的元素的位置都平均分布，并且向两边对齐</h5>
<p><img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=af5046d7015758389d15ab5ab4bdccb0&amp;file=file.png" alt="" /></p>
<h5>备注</h5>
<ul>
<li>更多返回错误代码请看首页的错误代码描述</li>
</ul>