html - 引导程序：插入在响应

Question

我正在使用响应式 Bootstrap 框架设计一个网站。

我有 3 个相邻的内容区域（水平）。如果我有一个小显示器，这两个内容在彼此之下（典型的响应式设计）。

现在我想<hr/>在彼此下方的每个内容块之后添加一个。

<div class="row-fluid content">
  <div class="span4">test1</div>
  <div class="span4">test2</div>
  <div class="span4">test3</div>
</div>

这是大显示器的全部代码。

在某些显示器上，有 2 个水平块和 2 个块下方的 1 个块。然后我想<hr/>在两行之间插入一个。

Answer 1

Bootstrap 提供类来根据媒体查询按设备管理任何元素的可见性。您必须放置<hr/>仅在特定视口中可见的元素：

<div class="row-fluid content">
    <div class="span4">test1</div>
    <hr class="visible-phone"/>
    <div class="span4">test2</div>
    <hr class="visible-phone"/>
    <div class="span4">test3</div>
</div>

查看更多响应实用程序类的文档。