0

私のHTML5コードは

     <div id="changeimg" align="center">
           <div id="imgbutton" onclick="changeimg()"/>
    </div>

私のCSSは

 #imgbutton
   {
     background-image:url('../images/tab1.png'); 
     height:35px;
     width:269px;
     border-radius:8px;
     margin-left:6%;
   }
    #changeimg
   {
     width:80%;
     height:50px;
     margin-left:5%;
     padding-top: 12px;
     z-index: 1;
  }

画像ボタン div で背景に画像を使用していますが、画面サイズを変更するときに画像 div の変更に従って画像を調整したいのですが、これを行うのを手伝ってくれる人はいますか?? 前もって感謝します！！

4

2 に答える 2

1

この投稿はあなたにとって興味深いかもしれません: CSS で背景画像のサイズを設定しますか?

このタスクは、CSS3 を使用することによってのみ達成できます。「background-size」をサポートしていないブラウザは、背景をスケーリングしません!

background-size: 100% auto; // 100% width and auto height, keeping aspect ratio
background-size: auto 100%; // 100% height and auto width, keeping aspect ratio
background-size: 100% 100%; // 100% width and height, aspect ratio will be lost
于 2012-09-20T13:02:10.007 に答える
0

画像に div を使用している理由はまだわかりません。

<div id="changeimg" align="center">
    <img id="imgbutton" src="../images/tab1.png" onclick="changeimg()" />
</div>

そしてこのcss

#imgbutton
{
  height:100%; /*I'm not 100% sure, but leaving height out might maintain aspect ratio*/
  width:100%;
  border-radius:8px;
  margin-left:6%;
}
#changeimg
{
  width:80%;
  height:50px;
  margin-left:5%;
  padding-top: 12px;
  z-index: 1;
}
于 2012-09-20T13:12:16.163 に答える