html - 如何垂直对齐字形？

Question

我需要字形与文本垂直对齐。现在它看起来更像是固定在底部的。

这里作为例子

<a href="#">Zoom</a>

a {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 32px;
    color: #333;
    text-decoration: none;
    text-transform: uppercase;
}

a:before { content:"\2039"; }

和一个jsFiddle

Answer 1

仅使用垂直对齐和固定偏移量最容易做到这一点。例如

a:before { content:"\2039"; vertical-align:0.1em; }

a {
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 32px;
    color: #333;
    text-decoration: none;
    text-transform: uppercase;
}

a:before { content:"\2039"; vertical-align:0.1em; }

<a href="#">Zoom</a>

参见http://jsfiddle.net/csh0da6o/3/