2

画面全体に画像を表示しようとしていますが、HTML は次のようになります。

<!DOCTYPE html>
<html lang="de">
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        <img src="./res/Default.png" width="100%" height="100%"/>   
    </body>
</html>

現在、ほとんどどこでもそうであるように見えますが、「HTC Incredible S」では画面の上半分しか表示されません。誰もがなぜ、および/またはどのように修復できるか知っていますか?

4

4 に答える 4

2

あなたはこれを行うことができます

top:0;
left:0; 
position:fixed; 
min-width:100%; //keeps it filling the browser window vertically
min-height:100%; //keeps it filling horizontally

Jsフィドル

フルスクリーンの結果

于 2013-04-12T08:38:56.790 に答える
2

これにより、画像が最大化されます。画像がビューポートよりも大きい場合、オーバーフローしますが非表示になります。画像で覆われていない白い領域が表示されることはありません。

<body>
    <img src="./res/Default.png"/>   
</body>

body {
    overflow: hidden;
}
img {
    min-width: 100%;
    min-height: 100%;
}

http://jsfiddle.net/bzTNV/2/

于 2013-04-12T08:37:50.433 に答える
1

あなたの問題は、ボディ コンテナーがウィンドウの 100% を占めるように設定されていないためです。

コードを使用した例: http://jsfiddle.net/ejTSL/1/

width:100%;height:100%;ブラウザ ウィンドウに固定された imgでスタイル設定された body の例: http://jsfiddle.net/9BnGD/2/

試す:

<!DOCTYPE html>
<html lang="de">
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body style="width:100%;height:100%">
        <img src="./res/Default.png" width="100%" height="100%" style="position:fixed;top:0;left:0;/>   
    </body>
</html>
于 2013-04-12T08:41:02.290 に答える