Question

我无法将这个@ font-face字体替换为crossbrowser工作，请帮忙。它可以在除9之外的所有部分工作，或者在所有部分工作，但是7和8即可。

我的字体为.eot .otf .svg。 ttf .woff？

由于

    /* works in all but ie 9 */
    @font-face {
        font-family: 'Deutsch';
        src: url('/fonts/Deutsch.eot');
        src: local('/fonts/Deutsch'), 
             url('/fonts/Deutsch.ttf') format('truetype'),
             url('/fonts/Deutsch.svg#font') format('svg'); 
    }
     /*from [http://blog.themeforest.net/tutorials/how-to-achieve-cross-browser-font-face-support/][1] */


    /* works in all but ie 7 and ie 8 */
    @font-face {
        font-family: 'Deutsch';
        src: url('/fonts/Deutsch.ttf'),
             url('/fonts/Deutsch.eot'); /* IE9+ */
    }
    /*from [http://w3schools.com/css3/css3_fonts.asp][2]*/

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <style type="text/css">



       /* code place holder location for css */



        #test
        {
            font-family:'Deutsch';
            font-weight:bold;
            text-decoration:underline;
            font-style:italic;
            font-size:30px;
        }

    </style>




</head>
<body>

    <div id="test">text goes here</div>

</body>
</html>

Answer 1

首先重写你的font-family，如下所示，

font-family: 'Deutsch', sans-serif;

如果不是因为你必须使用网站，它会将你的ttf格式转换为其他不同格式的字体......

选中此项http://www.fontsquirrel.com/fontface/generator

Answer 2

我只是想分享一下，因为这似乎有效。

    @font-face {
     font-family: 'Deutsch';
     font-style: normal;
     font-weight: normal;
     src: url('/fonts/Deutsch.eot');
     src: url('/fonts/Deutsch.eot?#iefix') format('embedded-opentype'),
     url('/fonts/Deutsch.woff') format('woff'),
     url('/fonts/Deutsch.ttf') format('truetype'),
     url('/fonts/Deutsch.svg#Deutsch') format('svg');
    }

和Squirel out把这个

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

}

@ font-face字体替换工作crossbrowser

2 个答案: