CSSで画像をどのように伸ばすのですか？

私は次のCSS持っている：それはこの混乱につながるCSSで画像をどのように伸ばすのですか？

<div class="mod left"></div>

：

enter image description here

は、ストレッチする方法はあります

.mod.left { 
background-image: url("http://www.myimage.jpg"); 
display: block; 
height: 160px; 
overflow: hidden; 
width: 175px; 
}

このHTMLに対応divに合う画像？画質を犠牲にしても？ありがとう！

2011-09-12 JZ.

CSS3プロパティbackground-sizeを使用できます。しかし、現時点では広くサポートされていません。

2011-09-12 22:27:32 GolezTrol

IE以外のすべてのブラウザを完全にサポートしています。それはIE9でのみ動作します。 – joshnh

IE9で動作する場合は、IEで正しく動作しますか？ ;-)これはおそらく、FFやChromeのいずれのバージョンでも動作しませんでした。しかし、フィードバックのおかげで、私はそれがすでに多くのブラウザでサポートされているか分からなかった。 – GolezTrol

今後の参考として、私はこのサイトを使用してブラウザの互換性を確認しています。http://caniuse.com/#search=background-size – joshnh

これには、CSS属性のbackground-sizeを使用できます。

2011-09-12 22:30:36 kevindh89

<div> 
    <img src="yourImage.jpg" alt="" /> 
</div> 

div{width:300px; height:300px; overflow:hidden;} //example 
img{width:100%;}

この方法では、画像はあなたの全体のdivをカバーするために、水平サイズが変更されます。高さを設定しないと、それに比例して自動的にサイズが変更されます。私はあなたのdivにoverflow:hidden;を入れることを提案します。画像比率がまったく同じでない場合、超過は隠されます。

2011-09-13 00:22:40

答えて