0

サイズに合った画像を表示するためにボタンを変更しようとしています。ソースコードはこちら

.ui-icon-myimg {
background: url(http://www.metalunderground.pt/download/file.php?avatar=2015_1331126201.jpg) no-repeat;}

(そうしないとjsfiddleをリンクできないため、このCSSをここに配置する必要がありました)

オレンジ色の円しか見えないのはなぜですか? 幅と高さを何度も変更しようとしましたが、うまくいく方法が見つかりません。

お願い助けて!

ありがとう

4

4 に答える 4

1

width:次元 ( 、 )を追加する必要がありますheight:。要素は、背景画像の大きさを認識していません。

于 2013-07-19T13:24:39.967 に答える
0

まず、画像がアイコンに対して大きすぎます。アイコン画像とボックスのサイズを入力する必要があります。以下のスパンクラスのサイズは適切でなければなりません。

.ui-icon ui-icon-myimg ui-icon-shadow{
   width: 50px;
   height: 50px; // or whatever size the icon is 
}

CSS シートを次のように変更する必要があります。

.ui-btn-inner {
  height: 120px;
  padding: 0.55em 11px 0.5em;
  width: 120px;
}

.ui-icon {
  height: 120px;
  width: 120px;
}

firebug のアイコンを右クリックしてコードを切り替えると ( padding と margins を消去する)、画像が完全に収まります。

于 2013-07-19T13:24:38.110 に答える