我知道html中有hr (横尺),但我不相信有vr (纵尺)。我错了吗?如果不是,为什么没有垂直规则?
发布于 2009-02-21 01:46:29
不,没有垂直规则。
编辑:现在是2021年(在我回答这个问题12年后),我不再认为我最初的解释是正确的:
(原文解释)
拥有一台是没有逻辑意义的。HTML是按顺序解析的,这意味着你从上到下,从左到右,按照你想要的方式排列HTML代码,从上到下,从左到右(通常情况下) vr标签并不遵循这种模式。
我不确定为什么VR标签从来没有被引入,但这可能不是因为HTML的解析方式-现在在HTML/CSS中有许多不同的布局模式不遵循这种“范例”。
如果我现在推测为什么没有VR标签,我可能会把MDN's definition of the HR tag看作一个线索:
超文本标记语言
<hr>元素表示段落级别元素之间的主题中断:例如,故事中场景的改变,或者小节中主题的转移。
然而,在实践中,<hr>标记最终的用途通常不是它的语义含义。尽管从实际应用来看,应该有一个<vr>标记,但它可能与<hr>标记的语义定义没有任何相似之处。它可能从来没有想过会被引入。
我的直觉是,创建者会建议这个问题的解决方案的领域是CSS,而不是HTML (所以这个问题的大多数答案都反映了这一点)。
对于这个问题,Nixinova's solution看起来是最优雅和最现代的解决方案。
(我旧答案的其余部分如下所示):
然而,使用CSS很容易做到这一点。例如:
<div style="border-left:1px solid #000;height:500px"></div>请注意,您需要指定高度或用内容填充容器。
发布于 2010-04-15 06:43:06
您可以像这样创建一条垂直规则:<hr style="width: 1px; height: 20px; display: inline-block;">
发布于 2019-05-07 12:29:44
一个inside a display:flex会让它垂直显示。
JSFiddle:https://jsfiddle.net/w6y5t1kL/
示例:
<div style="display:flex;">
<div>
Content
<ul>
<li>Continued content...</li>
</ul>
</div>
<hr>
<div>
Content
<ul>
<li>Continued content...</li>
</ul>
</div>
</div>https://stackoverflow.com/questions/571900
复制相似问题