html - 複数のレスポンシブ背景画像

Question

私が持っている

    .container {
        width: 960px;
        margin: 0 auto;
    }
    .bgcontainer {
            width: 960px;
            background-image:url(images/midbg.gif);
            margin: 0 auto;
}

コンテナーに浮かぶ 2 つの (背景) 画像を添付する必要があります。画像でわかるように 2 つの翼。

1024 px のような場所がない場合は非表示にする必要があります。

Answer 1

メディア クエリを使用する必要があります。これで問題が解決するはずです。

@media screen and (max-width: 1024px) {
    .bgcontainer {
        background-image:none;
    }
}

これは複数のスタイルで機能します。更新されたスタイルがメディアクエリの{}括弧の間にあることを確認してください

Answer 2

あなたの体に背景を置きます。

http://codepen.io/anon/pen/fAsHa