0

我在 HTML 电子邮件中嵌入了两个权重的 Raleway 并希望自行托管。

我使用 Font Squirrel 转换了 Regular 和 Extra Bold 权重，但只有常规权重有效。不确定是否可能存在某种冲突，因为它实际上是一种字体被嵌入为两个独立的字体？

字体文件本身在桌面上看起来是正确的。在本地浏览器中，两种字体都可以使用。

想知道是否有另一种方法来转换可以回避问题的字体？

嵌入代码：

@font-face {
    font-family: 'ralewayregular';
    src: url('raleway-regular-webfont.eot');
    src: url('raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('raleway-regular-webfont.woff') format('woff'),
         url('raleway-regular-webfont.ttf') format('truetype'),
         url('raleway-regular-webfont.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'ralewayextrabold';
    src: url('raleway-extrabold-webfont.eot');
    src: url('raleway-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
         url('raleway-extrabold-webfont.woff') format('woff'),
         url('raleway-extrabold-webfont.ttf') format('truetype'),
         url('raleway-extrabold-webfont.svg#ralewayextrabold') format('svg');
    font-weight: normal;
    font-style: normal;

}

字体堆栈示例：

font-family: 'ralewayregular',Futura,'Gill Sans','Gill Sans MT', Calibri, sans-serif;

font-family: 'ralewayextrabold',Futura,'Gill Sans','Gill Sans MT', Calibri, sans-serif;

编辑：

我之前尝试了一个修改过的字体堆栈，将 Raleway 视为一种具有两种权重的字体。看起来额外的粗体现在在某些客户端中起作用，但不适用于通常在 iPad 上显示 Web 字体（如 Apple Mail）时没有问题的电子邮件客户端。

@font-face {
    font-family: 'raleway';
    src: url('raleway-regular-webfont.eot');
    src: url('raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('raleway-regular-webfont.woff') format('woff'),
         url('raleway-regular-webfont.ttf') format('truetype'),
         url('raleway-regular-webfont.svg#ralewayregular') format('svg');
      font-weight: 400;
    font-style: normal;

}




@font-face {
    font-family: 'raleway';
    src: url('raleway-extrabold-webfont.eot');
    src: url('raleway-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
         url('raleway-extrabold-webfont.woff') format('woff'),
         url('raleway-extrabold-webfont.ttf') format('truetype'),
         url('raleway-extrabold-webfont.svg#ralewayextrabold') format('svg');
      font-weight: 800;
    font-style: normal;


}

修改后的字体堆栈：

<h1 style="font-size : 16px; line-height : 24px; letter-spacing : 2.72px; color: #ffffff; font-family: 'Raleway',Futura,'Gill Sans','Gill Sans MT', Calibri, sans-serif;  font-weight: 800;">TEXT</h1>
4

1 回答 1

0

首先，您不需要那些引号，因为您正在使字体系列成为一个单词。其次，你真的不需要有两个不同的字体名称，你可以通过保持相同的名称保持相同的字体名称，font-family但在font-weight:bold你的@font-face 的粗体部分。font-weight在您的内联 css 或 by <b>or<strong>标签中指定它应该可以正常工作。除非您的 @font-face 根本没有加载并且您的操作系统堆栈中有字体，否则人造粗体不是问题。

在测试之前，您还应该尝试从计算机的字体堆栈中禁用 raleway。我的字体文件的 url 也位于绝对路径上。

希望其中之一有所帮助。

于 2013-09-30T15:41:44.127 回答