Search code examples
iphonecsssafariwebkitfont-face

@font-face is deprecated on the iPhone version of Safari. What are my alternatives?

According to Apple's documentation, @font-face is deprecated for use on the iPhone version of Safari. The iPhone only includes 11 fonts, AFAIK, and, in any case, I need a nice blackletter font for an app I'm building. I'll be generating random text, so images are not an option. What alternatives do I have? Am I stuck with a JavaScript solution like Cufón?

Solution

  • Well, just found out @font-face is NOW support on the current iPhone and iPad. The documentation linked to above, which is Safari CSS Reference Shows the example for how to embed the font.

    @font-face {
    font-family: "MyFamilyname", cursive [, ...];
    font-style: normal [, ...];
    font-variant: normal[, ...];
    font-weight: bold[, ...];
    font-stretch: condensed[, ...]; /* Not supported */
    font-size: 12pt;[, ...] /* Not supported */
    src: local("Font Family Name"),
        url(http://..../fontfile.ttf) format("truetype"),
        url(http://..../fontfile.ttf) [, ...];
}

    Just wanted to make sure someone else who came along and read this like me, knew the current state.