javascript - HTML 中的嵌套类

Question

因此，我尝试在带有侧边菜单的较大屏幕上显示类 col-md-3，在较小屏幕上显示类 pure-container。侧边菜单的内容应该在没有 hamburger pan 的大屏幕上定期显示，但在小屏幕上它应该包含在 hamburger 菜单中。

较大的屏幕尺寸可以很好地显示内容，较小的屏幕尺寸显示侧面菜单但缺少内容，有什么建议吗？我尝试为 pure-drawer 添加 content visible-xs visible-sm 但它不起作用，我还尝试了媒体查询。

这是代码。

<div class="col-md-3 content visible-md visible-lg">
  <?php  include_once 'helper/block_news_list.php'; ?>
</div>

<!-- Begining of the pure-drawer -->
<div class="pure-container" data-effect="pure-effect-push">
  <input type="checkbox" id="pure-toggle-left" class="pure-toggle" data-toggle="left" />
  <label class="pure-toggle-label" for="pure-toggle-left" data-toggle-label="left"><span class="pure-toggle-icon"></span></label>

  <nav class="pure-drawer" data-position="left">
    <br>
    <br>
    <br>
    <p style="padding: 10px 20px; margin: 0;">
      <?php include_once 'helper/block_news_list.php'; ?>
    </p>
  </nav>
</div>

Answer 1

这是因为您使用了 include_once 来防止相同的代码被渲染两次。结果，您的 pure_drawer 实际上是空的。

你可以改变

<?php include_once 'helper/block_news_list.php'; ?>

到

<?php include 'helper/block_news_list.php'; ?>

为了在两个容器中呈现新闻列表。