2016-04-12 35 views
3

我试图尽可能写出最好的标题,但我不确定如何准确描述这里发生的事情,所以请随时纠正它。为什么>直角引号(")不是垂直对齐的?

我想使用>直角引号(')而不是>直角引号(>),而'rsaquo;字符比位于行底部的>短,类似于句点(。)。这使得垂直对齐字符变得困难,而当我将其设置为42px时,它很明显。

是否有任何其他我可以使用的字符或任何我可以垂直对齐的方式?它可能是我的字体,但我没有使用任何特别的东西。

下面是两个字符的示例。第一个是>经常性右角支架,第二个是"位于底部的直角支架。

> character - vertically aligned › character - sitting on the bottom

+6

我完全肯定字符的排列完全取决于字体如何定义字形。这就是为什么它不是垂直对齐的原因。 – amphetamachine

+0

谢谢;看起来这是它看起来像这样的唯一原因。我会研究其他方式来让它垂直对齐,比如简单地将其定位得更高或使用不同的字体。 – Alesana

回答

2

尝试在span隔离的特点和使用CSS属性line-heightfont-size垂直对齐。

此外,标准字体,如:宋体,verdana等默认情况下是正确垂直对齐的。

See example

+0

我曾经玩过使用行高的孤立角色,但无法使其工作。在宋体中(即使在你的例子中)角色仍然坐在底部,在verdana它是更垂直对齐,但也比我想要更清晰。我想我会尝试找到一种以最好的方式显示它的字体。 – Alesana

+0

(抱歉,延迟)请参阅更新的示例。 – Oriol

+1

与示例中相同的效果也可以简单地使用填充底部进行复制:-(x)px ;,因为将行高设置为小于字体只会使其看起来垂直对齐。我想避免这种情况,因此我问为什么它不是垂直对齐的,看看我是否可以真正垂直对齐角色而不是欺骗它。我的问题的真正答案就是,在Arial字体中,›符号不是垂直对齐的。 amphetamachine已经在评论中正确回答了我的问题,但不幸的是我不能接受他的回答,因为这是一条评论。 – Alesana

0

前面已经回答amphetamachine,这取决于你使用特定的字体如何定义的字形。

我发现解决这个问题的最佳方式(没有硬编码的像素偏移量)就是将字符放入自己的跨度,然后应用:vertical-align:PERCENTAGE%。 (在我的情况下,vertical-align:11%运行良好,但它取决于字体)。

以百分比形式表示即使使用不同的字体大小,它也会保留相同的位置。