jquery - 垂直小时标签

Question

有没有类似 hr 标签的东西，但在垂直意义上？

我不想使用表格，但基本上我有两个选项卡，并且我希望在选项卡的标题之间有一条线。

这是一个快速的jsfiddle。

编辑：新版本的jsfiddle使用border-right

编辑：足够接近！但是，如果我将 padding-top = 10 放在friendsH 和familyH 中而不是标题中，由于某种原因它可以完美地工作，但是事情并没有垂直居中，所以我认为我更喜欢这种方式

这似乎是一种黑客方法，但如果这是唯一的方法，那么我想这只是同一个问题。

score 3 · Accepted Answer

是的你可以。<hr style="display: inline" />将导致垂直规则。

（不过，在 IE7 中失败，因此您可能需要对样式进行条件注释以隐藏它或将其替换为|）

score 2 · Accepted Answer

没有“垂直”小时标签。您可以使用“border-left”和“border-right”css 属性来获得这样的效果。

score 0 · Accepted Answer

HTML 没有任何原生内容。您可以使用 CSS 创建一些东西，例如使用非常窄的 div，例如仅在一侧有边框或图像背景。如果您使用 jquery，您可能会找到一个插件来执行此操作，但它可能具有更多功能，例如允许用户拖动和调整划分区域的大小。

score 0 · Accepted Answer

0

这个怎么样：

于 2012-07-27T20:59:13.933 回答

score 0 · Accepted Answer

我最近学到了一个技巧，它会产生一个垂直的<hr>：

<hr width="1" size="500" style="display:inline-block;">

score 0 · Accepted Answer

没有垂直 hr 标签，但是您可以使用 css 制作垂直 hr

.vhr {
  width: 1px;
  height: 200px;

  }

<div class="v-hr"></div>

6 回答 6