@ font-face - .ttfと.svgをインポートした後にカスタムフォントが表示されない

Question

私が開発しているウェブサイトで、@font-faceカスタムフォントをインポートして表示できます。

それは私が何をしたか具体的に異なるブラウザ上で完全に

をして動作します：

@font-face { 
font-family: 'MyCustomFont'; 
src: url('assets/fonts/MyCustomFont.eot'); /* IE9 Compat Modes */ 
src: url('assets/fonts/MyCustomFont.eot?#iefix') format('embedded-opentype'); /* IE6-IE8 */ 
src: url('assets/fonts/MyCustomFont.woff') format('woff'); /* Pretty Modern Browsers */ 
} 

body { 
font-family: 'MyCustomFont', sans-serif; 
} 

問題は、私はの.ttfと.SVGをインポートしようとすると、がフォーマットしていることですフォントが表示されなくなり、フォールバックフォントが適用されます。

これはどうして私が

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

body { 
font-family: 'MyCustomFont', sans-serif; 
} 

の.svgとの.ttfをインポートする方法ですが、この起こっているのでしょうか？

修正することはできますか？事前

Answer 1

で

おかげではなく、各行の末尾にカンマを入れて「;」ソースを一度しか定義しません。

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