3

コンテナのサイズよりも大きい背景画像を含む空のdivがあります。background-imageこれをプロパティで値（100％100％）で修正します。IE8とIE7で例を開くまでは、これで問題ありません。javascriptスクリプトやjqueryプラグインでさえ、そのための解決策はありますか？

すなわち： http： //jsbin.com/imirer/1/edit

すなわち： http： //jsfiddle.net/bPTzE/

HTML：

<div class="container">
    <div class="background"></div>
</div>

CSS：

.container {
    /* an example width for responsive perpose */
    width: 500px;
}

.background {
    height: 27px;
    background: url("http://s18.postimage.org/jhbol7zu1/image.png") no-repeat scroll 100% 100% transparent;

    /* not working in IE8 and IE7 */
    background-size: 100% 100%;
}
4

2 に答える 2

2

background-sizeはCSS3固有であり、IEではサポートされていないため、IEで機能させるには、次のような操作を行う必要があります。

HTMLと本文をに設定します

html {overflow-y:hidden}
body {overflow-y:auto}

フルスクリーンにする画像をdiv＃page-backgroundでラップします

#page-background {position:absolute; z-index:-1}

次に、これをhtmlファイルに入れます

<div id="page-background">
  <img src="/path/to/your/image" width="100%" height="100%">
</div>

**マージンとパディングを削除するには、ある種のリセットを使用する必要があります。

html, body {height:100%; margin:0; padding:0;}
于 2013-02-05T10:23:37.470 に答える
1

background-sizeはie7およびie8ではサポートされていません。

divタグにput'tag'を使用して、幅を100％追加する別の方法。フルスケーラブルです。

このコードを試してください：

<div class="container">
    <img src="http://s18.postimage.org/jhbol7zu1/image.png" width="100%" />
</div>

また

html：

<div class="container">
    <img src="http://s18.postimage.org/jhbol7zu1/image.png" />
</div>

css：

.container img {
     width:100%
 }
于 2013-02-05T10:23:14.870 に答える