Question

我有3个元素，我希望第三个元素显示在前一个元素之前。第三个元素也是一个图像，高度因每个内容而异。

我的结构是：

<div class="first">
 ..
</div>

<ul>
 <li>..</li>
</ul>

<div class="image">
</div>

如何使用css在第一个div之前显示图像？如果这个配置不可能，我也可以为ul创建一个新的div，但前提是不可能。

Answer 1

解决方案是使用order flex属性：

body {
  display: flex;
  flex-direction: column;
}
.image {
  order:-3;
}

<div class="first">
 first
</div>

<ul>
 <li>li</li>
</ul>

<div class="image">image
</div>