bootstrap：在响应式插入 <hr/>

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/>在两行之间插入 a 。

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>

检查文档以获取更多响应式实用程序类。