css - 寸法を指定する代わりに、background-size:cover を使用して画像を再構成できますか?

Question

だから私はウェブサイトの網膜グラフィックスについていくつか読んだことがあります.私の画像のほとんどは2倍になる可能性があるので、@media queries.

ただし、サイジングについて私が見つけたのは、寸法を指定する必要があるということだけでしたが、私は疑問に思っています: background-size:cover!を使用した背景画像はどうですか?

次のように:

div {
    background-image: url('../images/foo.png');
    background-size:cover;
    height:100%;
    width:100%;
    // max-size:1920px by X
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 1921px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 1921px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 1921px),
only screen and (        min-device-pixel-ratio: 2)      and (min-width: 1921px),
only screen and (                min-resolution: 192dpi) and (min-width: 1921px),
only screen and (                min-resolution: 2dppx)  and (min-width: 1921px) {
    div {
        background-image: url('../images/foo@2x.png');
        background-size:cover;
        height:100%;
        width:100%;
        // min-size:1921px by X
    }
}

2 番目の質問です。最大約 2400x1380 の画像があるが、訪問者のマシンの最大解像度が Macbook 15 インチ Retina のように 2880x2160 である場合、@2X エクスペリエンスを完全にサーバー化することはできません。何があっても @2x を配信しますか、それとも通常の最大 1920 ピクセルの画像を配信しますか?

そして 3 番目に、1 と 2 に関して - を使用している間:cover、寸法を指定していないため、@2x 画像の最小値がわからない。それを念頭に置いて、「網膜画像と使用の場合、画像は少なくともこの寸法でこれで:coverなければなりません」と言う方法はありますか?

ありがとう！