@fontface不起作用

时间:2012-08-20 08:54:40

标签: asp.net html css visual-studio-2010 css3

@font-face {
    font-family: 'CodeLight';
    src: url("font/CODE_Light.eot"); /* IE9 Compat Modes */
    src: url("font/CODE_Light.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
         url("font/CODE_Light.woff") format("woff"), /* Modern Browsers */
         url("font/CODE_Light.ttf")  format("truetype"), /* Safari, Android, iOS */
         url("font/CODE_Light.svg#svgFontName") format("svg"); /* Legacy iOS */
    }

我正在尝试使用@font face加载上面的字体,但是当我在chrome开发人员工具中检查它时它会给出404。任何人都可以解释这有什么问题。

2 个答案:

答案 0 :(得分:2)

如果它给你404,你已经为你的字体指定了错误的网址......

如果你有这样的目录结构:

~
    css
           style.css
    fonts
           font1.eot
           font2.ttf

你显然必须这样设置:

src: url('../fonts/font1.eot")

答案 1 :(得分:0)

如果位于根目录中,您可以提供“font”目录的完整路径或在其前面使用“/”。像这样:

src: url("/font/CODE_Light.eot");
...