zoukankan      html  css  js  c++  java
  • css引入外部字体

    <style> 
    @font-face
    {
    font-family: myFirstFont;
    src: url('Sansation_Light.ttf'),
         url('Sansation_Light.eot'); /* IE9+ */
    }
    
    div
    {
    font-family:myFirstFont;
    }
    </style>

    不同浏览器字体的格式有差别

    Firefox、Chrome、Safari 以及 Opera 支持 .ttf (True Type Fonts) 和 .otf (OpenType Fonts) 类型的字体。

    Internet Explorer 9+ 支持新的 @font-face 规则,但是仅支持 .eot 类型的字体 (Embedded OpenType)。

    注释:Internet Explorer 8 以及更早的版本不支持新的 @font-face 规则。

    字体后缀和浏览器有关,如下所示
    * .TTF或.OTF,适用于Firefox 3.5、Safari、Opera 
    * .EOT,适用于Internet Explorer 4.0+ 
    * .SVG,适用于Chrome、IPhone 
    比如:
    @font-face {
        font-family: 'HansHandItalic';
        src: url('fonts/hanshand-webfont.eot');
        src: url('fonts/hanshand-webfont.eot?#iefix') format('embedded-opentype'),
             url('fonts/hanshand-webfont.woff') format('woff'),
             url('fonts/hanshand-webfont.ttf') format('truetype'),
             url('fonts/hanshand-webfont.svg#webfont34M5alKg') format('svg');
        font-weight: normal;
        font-style: normal;
    }
     
  • 相关阅读:
    第03组 Alpha冲刺(2/4)
    第03组 Alpha冲刺
    第09组 Beta版本演示
    第09组 Beta冲刺(4/4)
    第09组 Beta冲刺(3/4)
    第09组 Beta冲刺(2/4)
    第09组 Beta冲刺(1/4)
    第09组 Alpha事后诸葛亮
    第09组 Alpha冲刺(4/4)
    第09组 Alpha冲刺(3/4)
  • 原文地址:https://www.cnblogs.com/ccllj/p/9016754.html
Copyright © 2011-2022 走看看