将文本基线与图像的特定垂直比例对齐

Question

假设我有以下 shitty 令人敬畏的徽标，其中包含一些无法使用WebFont下载字体呈现的艺术文字

在图像中，文本基线距离顶部为68％，从底部为32％。

现在，我想将HTML文档的文本与图像中文本的基线对齐，其中包含此图像，我知道这是图像高度的特定垂直比率。

我需要哪些CSS属性和哪种HTML <div> / <span>嵌套结构？

Answer 1

我能想到的最好的方法是使用带有translateY的CSS3变换。像这样：

img {
    transfom:translateY(32%);
    -webkit-transfom:translateY(32%);
}

这个小提琴中的工作示例：http://jsfiddle.net/HhFLf/