Question

这是我的CSS（在iOS 4.2中有效）的示例，但在iOS＆lt; 4.1）的任何早期版本中都不起作用

/**** CSS3 Font embedding ****/
@font-face {
font-family: 'ChevinLight';
src: url('./uploads/fonts/chevilig-webfont.eot');
src: url('./uploads/fonts/chevilig-webfont.ttf') format('truetype'), url('./uploads/fonts/chevilig-webfont.svg') format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'ChevinBold';
src: url('./uploads/fonts/chevibol-webfont.eot');
src: url('./uploads/fonts/chevibol-webfont.ttf') format('truetype'), url('./uploads/fonts/chevibol-webfont.svg') format('svg');
font-weight: normal;
font-style: normal;
}


body {
height: 100%;
font-family: Helvetica, Arial, sans-serif;
background: #009933;
padding: 0 10px 0 10px;
}


/****** ELEMENTS *****/
h1, h2 {
text-transform: uppercase;
color: #FFFFFF;
}
h1 {
font-family: 'ChevinBold', Helvetica, Arial, sans-serif;
font-size: 16px;
margin: 0 0 5px 0;
font-weight: normal;
line-height: 1px;
}
h2 {
font-family: 'ChevinLight', Helvetica, Arial, sans-serif;
font-size: 16px;
margin: 6px 0 5px 0;
font-weight: normal;
line-height: 1px;
}
p {
font-family: 'ChevinLight', Helvetica, Arial, sans-serif;
font-size: 15px;
font-weight: normal;
color: #FFFFFF;
}

在这些iOS版本中，我无法找到（或找到）在这些早期版本的Safari中嵌入字体的方法。

请有人帮忙吗？

感谢。

Answer 1

必须像这样引用SVG字体：

@font-face {
    font-family: 'KomikaHandRegular';
    src: url('Komika_Hand-webfont.ttf') format('truetype'),
         url('Komika_Hand-webfont.svg#webfontATHY6trD') format('svg');
    font-weight: normal;
    font-style: normal;
}

...其中#webfontATHY6trD是SVG文件中的字体ID。它应该看起来像这样（只需在文本编辑器中打开它）：

font id="webfontATHY6trD" horiz-adv-x="1259"

Answer 2

旧版本的safari只接受svg格式的字体。使用像字体squirrel这样的在线字体转换器来生成该格式的字体。

@ font-face嵌入iOS 3.0 - 4.1

2 个答案: