如何在div中的文本中间创建span元素

Question

我有一个像bellow的代码：

<div style="font-size:58px;"> Name <span style="font-size:18px; vertical-align:middle;">|</span> 2015-04-01 </div>

然后我有这样的结果

但是我希望span元素像这样高一点

所以请教我怎么做，非常感谢。

Answer 1

实际上span元素在技术上已经处于中间位置。您可以在vertical-align:top;元素上应用vertical-align:bottom;，vertical-align:middle;或span来验证这一点。

除此之外，我建议使用

position:relative;
top:-.5em;

<{1>}上的

。使用span单位使其依赖于字体大小（尽管这并不完美，因为它取决于em元素的字体大小）。

演示：

span

当然，您可以根据需要调整价值。