リセットCSSによってGoogleフォントの@importが動作しない

Question

Meyers Reset Css私の他のCSSの直ぐ上に1行のルールがありますが、Hindフォントが適用されず、代わりにTimes New Romanが使用されています。

Reset Css行をコメントアウトすると、Hindフォントが適用されます。

私のHindフォントファミリーをリセットするCSSが適用されないのはなぜですか？ font-family:'Hind'をhtml { }とbody { }の両方に入れても、Reset Cssが存在しない場合にのみ適用されます。

私のCss：

// Reset Css bunch of rules here 
@import url(https://fonts.googleapis.com/css?family=Hind:400,600,700); 
html { background: #F5F5F5; font-family: "Hind"; } 

ライブデモ：http://jsbin.com/yudeziqiki/1/edit?html,css,output

Answer 1

あなたはリセット前@importを配置する必要があります。

@import url(https://fonts.googleapis.com/css?family=Hind:400,600,700); 
/* Meyers Reset Css Here */ 

Answer 2

アット・ルール@importのCSSは、他のスタイルシートからスタイルルールをインポートするために使用されます。これらのルールは、ルールの他のすべてのタイプ、[...]
MDN

に先行しなければならないだけでリセットCSSの前に@importルールを入れて、あなたの問題が解決されます。