1

私の質問は背景画像についてです。iPhone画面用のホームページをデザインしていて、モバイル版では少し違う画像を使いたいと思っていました。私のメディア クエリは個別の css ファイルではなく、index.html に埋め込まれていました。問題...メインのCSSイメージがクエリイメージを上書きしていました。余分なブラケットなどをチェックしました。メディア クエリがメインの CSS よりも優先されると思いましたか? メディア クエリを css リンク ファイルに入れていたら、望ましい結果が得られたでしょうか?

これが私のメインのcssコードです：

#container
{
  background-image:url(images/1000_framec.jpg);
  background-repeat:no-repeat;
  width:999px;
  height:980px;
  margin:0 auto;
}

以下は私のメディアクエリコードです:

@media only screen and max-width 320px {
  #container
  {
    width:98%;
    background:url(images/1000_frameo.jpg) no repeat left;
    margin-top:80px;
    -webkit-background-size:contain;
    -moz-background-size:contain;
    -o-background-size:contain;
    background-size:contain;
  }
}
4

1 に答える 1

3

メディア クエリと@mediaルールはCSS です。ただし、これらはカスケードに対して透過的であるため、スタイル ルールをルールに配置する@mediaかどうか、またはリンクされたスタイル シートに配置するかどうかはmedia="..."、カスケード内のそのルールの優先順位に影響しません。

残りのカスケード ルールは通常どおり適用されます。最も具体的なセレクターが優先され、一連の等しく具体的なセレクターの最後のセレクターが優先されます。インライン スタイルは内部スタイルシートよりも優先され、内部スタイルシートは外部スタイルシートよりも優先されます。すぐ。

于 2013-01-19T13:19:31.273 に答える