0

ライブサイト。

これは、モバイルデバイスと通常の画面で異なるCSSを利用する最初の試みです。これを行うために、私は使用しています-

@media only screen 
    and (min-device-width : 320px) 
    and (max-device-width : 480px) {
        background: url('img/background.jpg') no-repeat center center fixed;
        background-size: cover;
        height: 100%;
}

ただし、機能していないようです（iPhoneでしかテストできません）。なぜそうなるのかについてのアイデアはありますか？私も@media all無駄にしようとしました。

4

1 に答える 1

2 
media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
         body{
           background: url('img/background.jpg') no-repeat center center fixed;
           background-size: cover;
           height: 100%;
         }
}

本文はターゲットとするHTML要素であるため<body>、HTMLにタグがあるとすると、デバイスが幅の基準を満たしたときに上記のCSSスタイルが適用されます。

編集：ファイルがあれば、このような背景も試してみてください...

background: transparent url(/img/background.jpg/) no-repeat center center fixed;

編集：!importantこの問題を修正したタグが判明しました。CSSの優先順位について詳しくは、こちらをご覧ください。

于 2012-08-29T21:37:01.713 に答える