Question

我想做一些不太努力的事情，但我不知道该怎么做。

现在我在这里有移动版的版本。

移动版看起来像这样：

这就是我想要的样子：

我在这里有代码。

  $query = "SELECT * FROM my_table";
                    $res = mysqli_query($con, $query);
                    $i = 0;
                    while ($row = mysqli_fetch_assoc($res))             
                   {
                   if($i%2==0)
                   {
                  echo "<div class='row' style='margin-right:0; margin-left:0'>



            <div class='col-md-6' style='padding:0;''>
                <img class='image-width img-responsive' src='images/my_img/".$row['primary_img']."' />
                        </div><!--/span-->


                <div class='col-md-6 find-content' style='margin-top:8%;'>
                   <img src='images/my_img/".$row['icon']."'/>
                    <p style='font-family:GothamBold;color:#ec1940;font-size:1.5em; margin-top:5%;'>".$row['title']."</p>
                    <p style='width:50%;margin-left:25%;' class='text'>".$row['text']."</p>
                  <a class='a-button'  href='atractions.php?id=".$row['id']."'>Hi</a>            
                </div><!--/span-->
                </div><!--/row -->";
             }
        else
        {
            echo " <div class='row' style='margin-right:0; margin-left:0'>

        <div class='col-md-6 find-content' style='margin-top:10%;'>
         <img src='img/descopera/icons/".$row['icon']."'/>
            <p style='font-family:GothamBold;color:#ec1940;font-size:1.5em; margin-top:5%;'>".$row['title']."</p>
            <p style='width:50%;margin-left:25%;' class='text-descopera'>".$row['text']."</p>
          <a class='a-button'  href='atractions.php?id=".$row['id']."'>Hi</a>    
        </div><!--/span-->


         <div class='col-md-6' style='padding:0;'>
              <img class='image-width img-responsive' src='images/my_img/".$row['primary_img']."' />
            </div><!--/span-->

        </div><!--/row--> ";
        }   
        $i++;
    }

Answer 1

我再次复制了代码，并使用了名为'visible'的引导程序

Answer 2

我不相信有一个简单的CSS解决方案来改变DOM元素的顺序。你需要Javascript。

修改我的答案..我会通过两次写出元素3来做到这一点 - 在元素2之前和之后。然后根据断点切换重复元素的显示。（这个答案仅适用于元素非常简单，因为重复标记不太理想）。

（旁注：我真的建议您查看一些模板，而不是像那样回显标记，例如Twig）

两列不同的位置

2 个答案: