0

メディアクエリに関して非常に基本的な質問があります

メディアクエリを介して呼び出されるさまざまなレイアウトでコンテンツを表示する際に問題なく動作するサイトをいくつか設定しましたが、デスクトップでそれらを表示して画面のサイズを変更すると、メディアクエリは呼び出されません。どこが間違っているかについての指針はありますか？

     <!DOCTYPE html>

    <html>
    <head>
        <title>Page Title</title>

        <style>
            div{
                background:red;
                width:600px;
                height:200px;
            }
            @media (min-width: 61px AND max-width: 600px) {
div {
               background:green;
}
        }
        </style>
    </head>

    <body>
    <div>Something</div>


    </body>
    </html>
4

1 に答える 1

1 
div {
  background:red;
  width:600px;
  height:200px;

  @media screen and (min-width: 61px) and (max-width: 600px) {
     background:green;
  }
}

http://jsfiddle.net/spacebeers/5NzrW/

メディア クエリは、div のセレクターの外側にありました。物事に関する限り、次のように出力していました。

div {
    background:red;
    width:600px;
    height:200px;
}

background:green;

背景：緑はそれ自体でした。コードを上部の例に置き換えれば問題ありません。

于 2012-08-23T09:54:20.207 に答える