1

だから私は背景画像のあるdivを持っています。このdivは、divのスペースの内容/サイズに応じて、高さと幅が大きくなる可能性があります。

ただし、背景画像のサイズを100%表示したいのですが、これは背景画像の周囲に境界線があり、ボタンのような効果を出すために境界線を表示する必要があるためです。

div.leadgen {
  background: url(/Website6/Styles/leadgen_center.png) repeat-x;
  color: #FFF;
  cursor: pointer;
  display: inline-block;
}

<div class="leadgen">
 <h3>
  This is the title
 </h3>        
 This is the description
</div>

編集

#solutionsNav div.leadgen {
background:url(/images/leadGen_bg2.png) no-repeat;
background-size: 100% 100%;  
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/leadGen_bg2.png', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/leadGen_bg2.png', sizingMethod='scale')";
behavior: url(/scripts/PIE.htc);
padding: 10px;
color: #FFF;
cursor: pointer;

}

これはすべてのブラウザで機能します。私が理解する必要があるのは、IE 7と8で、background:url(/images/leadGen_bg2.png)no-repeatを使用したくないということだけです。倍増しているようですから。

4

2 に答える 2

6

background-sizeCSS3以降で使用可能なCSSプロパティを使用できます。

background-size: 100% 100%;

IEのサポートについては、このStackOverflowスレッドをご覧ください。

于 2012-04-25T13:32:50.003 に答える
0

これをチェックしてください:バックグラウンドでCSS画像をストレッチして拡大縮小します-CSSのみ

このテクニックを本体ではなくdivで機能させたい場合はposition: relative;、divのcssに追加します。

于 2012-04-25T13:32:45.927 に答える