0

すべての IE ブラウザで画像を拡大縮小したいと考えています。

私のコード:

<div class="outer"><img src="text.png" /></div>

CSS

.outer {
   position:absolute;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   text-align: center;
}
img {
   min-height: 100%;
}

このように、img-Tag は幅で自動スケーリングを行います。しかし、それは IE では機能しません。画像は垂直方向に拡大縮小するだけです。

誰でも私を助けることができますか？

4

2 に答える 2

1

画像の幅を常にブラウザー ウィンドウ全体に広げたい場合は、子孫に対して幅のパーセンテージが正しく機能するように、bodyおよび親コンテナー (この場合outerは ) を設定する必要があります。width: 100%次に、画像に明示的な幅を設定する100%と、高さが自動的にスケーリングされます。

body, .outer {
    width: 100%;
}
img {
    width: 100%;
}

jsfiddle

于 2013-02-21T08:35:42.083 に答える
0

msdnによると、

包含ブロックの高さが明示的に設定されていない場合、要素には最小の高さがなく、min-height プロパティは 0% として解釈されます。

親コンテナーの高さを明示的に指定する必要があります。

body{height: 800px;}  /* set your own height here */

サイトポイントによると

包含ブロックの高さが明示的に指定されておらず (つまり、コンテンツの高さに依存)、この要素が絶対位置に配置されていない場合、パーセント値はゼロとして扱われます。

于 2013-02-21T08:56:12.477 に答える