@fontface适用于Mac/iPhone/iPad的Quicksand Light

Question

我已经安装了webkit Quicksand Light并预订到了我的CSS文件，但它在PC上的所有浏览器中都能正常工作，但是当我在任何浏览器的流沙中在MAC上查看它时轻的网页字体不会正确显示出来，就像是一种新的罗马字体。它不拾取字体吗？或者它只是不渲染？

找不到任何解决这个问题，一直在一整天试图修复它

CSS：

@font-face { 
font-family: 'QuicksandLight'; 
src: url('/assets/fonts/Quicksand_Light-webfont.eot'); 
src: url('/assets/fonts/Quicksand_Light-webfont.eot?#iefix') format('embedded-opentype'), 
    url('/assets/fonts/Quicksand_Light-webfont.woff') format('woff'), 
    url('/assets/fonts/Quicksand_Light-webfont.ttf') format('truetype'), 
    url('/assets/fonts/Quicksand_Light-webfont.svg#QuicksandLight') format('svg'); 
    /*url('/assets/fonts/Quicksand_Light.otf');*/ 
font-weight: normal; 
font-style: normal; 

} 

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

} 

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

} 

CSS的QuicksandBook;

body 
{ 
font:13px/24px 'QuicksandBook', Arial,sans-serif; 
font-weight: normal; 
} 

这些已经在头部被引用。

Answer 1

不幸的是，我没有可用的Mac测试，但这里列出的一些指针可能值得一试。让我们知道您的身体情况如何！

http://paulirish.com/2010/font-face-gotchas/#smiley

Answer 2

我通常加载所有的我的字体的在我的CSS的最高层 - 我不知道这是否有差别。

而且以供将来参考，你可以做你的字体是这样的：

@font-face { 
font-family: 'Quicksand'; 
src: url('/assets/fonts/Quicksand_Light-webfont.eot'); 
src: url('/assets/fonts/Quicksand_Light-webfont.eot?#iefix') format('embedded-opentype'), 
    url('/assets/fonts/Quicksand_Light-webfont.woff') format('woff'), 
    url('/assets/fonts/Quicksand_Light-webfont.ttf') format('truetype'), 
    url('/assets/fonts/Quicksand_Light-webfont.svg#QuicksandLight') format('svg'); 
    /*url('/assets/fonts/Quicksand_Light.otf');*/ 
font-weight: lighter; 
font-style: normal; 

} 

@font-face { 
font-family: 'Quicksand'; 
src: url('/assets/fonts/Quicksand_Light_Oblique-webfont.eot'); 
src: url('/assets/fonts/Quicksand_Light_Oblique-webfont.eot?#iefix') format('embedded-opentype'), 
    url('/assets/fonts/Quicksand_Light_Oblique-webfont.woff') format('woff'), 
    url('/assets/fonts/Quicksand_Light_Oblique-webfont.ttf') format('truetype'), 
    url('/assets/fonts/Quicksand_Light_Oblique-webfont.svg#QuicksandLightOblique') format('svg'); 
font-weight: lighter; 
font-style: italic; 

} 

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

} 

这意味着你可以参考字体粗细在你的CSS，而不是设置字体为斜。例如

body 
{ 
font: italic lighter 13px/24px 'Quicksand', Arial,sans-serif; 
} 

，将打印字体斜体在风格打火机