0

ページの幅と高さを100％画像で埋めたいと思っています。

私はいくつかのCSSを見つけましたが、このタスクを実行する現在の場所を思い出せません-しかし、私の画像は16：9であり、4：3モニターで表示すると、画像はより狭い幅に合うように押しつぶされます。

したがって、16：9に画像はきちんと収まり、他の解像度（またはブラウザサイズ）では画像が一元化されてトリミングされるため、エッジが失われます。

フィドルからわかるように、テスト画像の白い正方形は正方形ではありません。

フィドル： http： //jsfiddle.net/7h6yt/

そしてCSS/HTML。

<img src=http://i47.tinypic.com/izyqyv.jpg>

        body{
            margin: 0;
        }

        img{
            min-height: 100%;
            min-width: 1024px;
            width: 100%;
            height: auto;
            position: fixed;
            top: 0;
            left: 0;
        }

        @media screen and (max-width: 1024px){
            img{
                left: 50%;
                margin-left: -512px;
            }
        }
4

1 に答える 1

1

を使用してみてください

background-size: cover;

このような属性？

http://jsfiddle.net/7h6yt/1/

于 2013-03-13T21:32:47.790 に答える