时间戳

首页 > 解决方案 > 如何将特定的 div 放在其他 div 之前？

javascript - 如何将特定的 div 放在其他 div 之前？

问题描述

我有一种情况，我需要在<div id="content1">之前放置<div id="content2">，但是<div id="content2">在另一个 div 中，所以带有推拉的 css 在这里不起作用。这是我的 HTML 结构：

<div class="col span_3_of_4">
  <div class="col span_3_of_4">
    <h1 class="title">Title</h1>
  </div>
  <div class="col span_1_of_4">
    <div class="fr">
      <a href="/" class="pdfgen funcicons" target="_blank"></a>
      <a href="/" class="print funcicons"></a>
      <a href="/" class="tsign funcicons"></a>
    </div>
  </div>
  <div class="cl"></div>
  <div class="divider"></div>
  <div class="formatedtext text">
    <div id="content2">
      <p>Content that needs to below content2 id</p>
    </div>
  </div>
  <div id="content1">
    <div class="col span_1_of_3 mlfix">
      <div id="datepick"></div>
    </div>
    <div class="col span_2_of_3"></div>
  </div>
  <div class="cl"></div>
  <div class="divider"></div>
</div>

<div id="content1"></div>之前如何放置整体<div id="content2"></div>？欢迎任何好的或肮脏的例子。

标签： javascriptjqueryhtmlcssfrontend

解决方案

如果你可以使用#content1之前的flex box 没问题。<div class="formatedtext text">

在父级上，<div class="col span_3_of_4">或者您可以包装<div class="formatedtext text">&<div id="content1">并display: flex;在其上使用。

然后order在元素上使用适当性<div class="formatedtext text">并给出值2，所以它会放在后面<div id="content1"></div>

这是一个例子：https ://jsfiddle.net/uvkdabor/1/

推荐阅读