flex布局内容左右排列

Flex布局可以非常方便地实现内容的左右排列，具体实现方法如下：

HTML代码：

<div class="container">
  <div class="left">左侧内容</div>
  <div class="right">右侧内容</div>
</div>

CSS代码：

.container {
  display: flex;
  justify-content: space-between;
}

.left {
  order: 1;
}

.right {
  order: 2;
}

上面的代码中，我们首先将父容器设置为Flex容器，然后通过`justify-content: space-between`属性将左右两侧的内容分别靠左和靠右排列。此时，左侧内容和右侧内容的排列顺序会按照它们在HTML文档中出现的顺序排列，即左侧内容在前，右侧内容在后。

如果我们想要调整左右内容的排列顺序，可以使用`order`属性。`order`属性的默认值为0，可以为负数或正数，数值越小，排列越靠前。因此，我们可以将左侧内容的`order`设置为1，将右侧内容的`order`设置为2，来实现左右排列。

这样，我们就可以非常方便地实现内容的左右排列了。