HTML中的嵌套类

时间:2016-07-05 05:47:50

标签: javascript html css class nested

因此,我尝试使用侧边菜单在较小的屏幕上显示较大屏幕的类col-md-3和类pure-container。侧面菜单的内容应在没有hamburger平移的较大屏幕上定期显示,但在较小的屏幕上,它应包含在hamburger菜单中。

较大的屏幕尺寸适用于内容,较小的屏幕尺寸显示侧面菜单,但它缺少内容,任何建议?我尝试将content visible-xs visible-sm包含在pure-drawer中,但它不起作用,我也尝试过媒体查询。

这是代码。

<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>

1 个答案:

答案 0 :(得分:2)

之所以发生这种情况,是因为您使用include_once会阻止相同的代码呈现两次。结果,您的pure_drawer实际上是空的。

您可以更改

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

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

以便在两个容器中呈现新闻列表。