2017-04-03 20 views
0

メディアクエリを使用する方法を学習していますが、私はどこかに行っていると思いますが、なぜこのクエリがデフォルトのCSSをオーバーライドするのか理解できません。メディアクエリがデフォルトのCSSをオーバーライド

@media screen and (max-width: 735px), screen and (max-height: 415px), screen and (orientation: landscape) { 

     #site-header img { 
      width: 50%; 
     } 
} 

それは私が特にメディアクエリーに先立って100%にすることをを設定していても、私のheaderimgは同様に私のデスクトップのフルビューで50%になります - との要件が満たさアレント、なぜまだ価値あります中古?

最後のサイズはscreen and (orientation: landscape)です。フルサイズのデスクトップでは通常のページのように見えますが、モバイルデバイスでは横向きで、モバイルでは見えません。風景が通常のフルビューとポートレートの携帯端末に影響するのはなぜですか?

答えて

1

ちょっとあなたが最後のメディアクエリは、画面が方向:横、画面の幅が画面の高さよりも広いことを意味しているかどうかを尋ねているだけです。これはデスクトップにも当てはまります。

だから、いや、ちょうどその最後のものを削除するか、通常我々はそれが好きな組み合わせ:画面と(最大幅:1024px)と(方向:横)

あなたがちょうどに各メディアクエリを分離することができますしたい場合このようなカンマと組み合わせるともっと分かりやすくなります。ちょっと混乱します。

関連する問題