here is an example of my CSS (which works in iOS 4.2) but doesn't work in any earlier verisons of iOS <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;
}
b开发者_如何学Pythonody {
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;
}
I can't work out (or find) a way of embedding fonts in these earlier versions of Safari in these iOS versions.
Please can anybody help?
Thanks.
SVG fonts must be referenced like this:
@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;
}
...where #webfontATHY6trD
is the ID of font in the SVG file. It should look something like this (just open it in a text editor):
font id="webfontATHY6trD" horiz-adv-x="1259"
Older versions of safari only accept font in svg format. Use an online font converter like font squirrel to generate fonts in that format.
精彩评论