0

以下に示すようなHTMLファイルがあります。要素の「background-size:cover」設定を使用します。

IE9 で [ファイル] メニューの [開く] オプションを使用してファイルを開くと、ウィンドウ全体を覆う背景画像が表示されます。これは予期される動作です。

しかし、Apache サーバー (http://127.0.0.1/test.html) 経由で同じファイルを開くと、背景画像がウィンドウ全体を水平方向に覆っていません...右端に空白の垂直ストリップが残ります。ウィンドウの。これは予期された動作ではありません。

他の背景画像ファイルでも同じ動作が見られます。Apache サーバーから HTML ページを取得する場合、「background-size:cover」設定では画像がある程度しか拡大されないようです。ただし、ファイル/開くオプションを使用して取得すると、要素の幅全体をカバーするのに十分な背景画像が拡大されます。

また、background-size 値の他の設定でも同様の動作が見られます (たとえば、background-size:100% 100%; を設定した場合)。

HTML ファイルは次のとおりです。

<html>
<head>
<style>
        body
        {
            background:url('desert.jpg');
            background-size:cover;
            background-repeat:no-repeat;
        }
</style>
</head>

<body>

        This is a line


</body>
</html>
4

1 に答える 1

1

このコードを試してください。問題が解決するはずです:

<style>
    body
    {
        background: url("desert.jpg") center center fixed no-repeat;            
        background-size: cover;
        background-color: #000;
        overflow: auto;
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='desert.jpg', sizingMethod='scale');
        -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='desert.jpg', sizingMethod='scale')";
    }
</style>

画像 詳細については、次の記事を参照してください: http://cookbooks.adobe.com/post_scale_background_image_to_browser_size-17590.html

于 2013-01-25T08:21:17.767 に答える