Responsive design 基金会4 -响应性下拉选项卡 我想知道是否有一个选项，当窗口变小时，基础4选项卡会下拉。

<div class="section-container auto" data-section>
  <section class="active">
    <p class="title" data-section-title><a href="#panel1">Section 1</a></p>
    <div class="content" data-section-content>
      <p>Content of section 1.</p>
    </div>
  </section>
  <section>
    <p class="title" data-section-title><a href="#panel2">Section 2</a></p>
    <div class="content" data-section-content>
      <p>Content of section 2.</p>
    </div>
  </section>
</div>

第1节的内容


第2节的内容

---

这里，链接仅在 .< /p> 基础中，可以使用可视性类来根据屏幕大小控制元素。 使用可见性类show for small only和hide for small only，我们显示div 分别

<div class="show-for-small-only">
    <a href="#" data-dropdown="drop1" class="button dropdown">Dropdown Button</a><br>
    <ul id="drop1" data-dropdown-content class="f-dropdown">
      <li><a href="#">This is a link</a></li>
      <li><a href="#">This is another</a></li>
      <li><a href="#">Yet another</a></li>
    </ul>
    </div>

<div class="hide-for-small-only">
<dl class="tabs" data-tab>
  <dd class="active"><a href="#panel2-1">Tab 1</a></dd>
  <dd><a href="#panel2-2">Tab 2</a></dd>
  <dd><a href="#panel2-3">Tab 3</a></dd>
  <dd><a href="#panel2-4">Tab 4</a></dd>
</dl>
<div class="tabs-content">
  <div class="content active" id="panel2-1">
    <p>First panel content goes here...</p>
  </div>
  <div class="content" id="panel2-2">
    <p>Second panel content goes here...</p>
  </div>
  <div class="content" id="panel2-3">
    <p>Third panel content goes here...</p>
  </div>
  <div class="content" id="panel2-4">
    <p>Fourth panel content goes here...</p>
  </div>
</div>

</div>

第一个面板的内容在这里

第二个面板的内容在这里

第三个面板的内容在这里

第四个面板的内容在这里

好的，但我可以在下拉菜单中创建一些链接来更改内容吗？因为它不工作，为了下拉链接改变内容，你添加了JavaScript。我认为这不适用于基础4。它将在地基5上工作。