0

画像を200pxスパンの右端に配置したいと思います。代わりに、「hello」テキストの最後に配置され、「hello」は200pxより短いため、200pxスパンの右端には配置されません。

<span>Hello</span>

span {
   background-image: url("image.gif");
   background-position:right center; 
   background-repeat: no-repeat;
   min-width: 200px;
   width: 200px;
}
4

3 に答える 3

4

スパン (インライン要素) に幅を設定することはできません。

に設定するdisplay: inline-blockと動作します。

于 2012-11-01T14:55:52.683 に答える
3

私が見る限り、スパンを 200px に保つ理由はないようです。画像と同じサイズのパディングを右側に追加して、さらに少し追加するのはどうですか? たとえば、image.gif の幅が 16 ピクセルの場合は、次のようにします。

padding-right:20px;

width と min-width を取り除きます。こうすれば、表示やブラウザの互換性の問題をいじる必要がなくなります。

于 2012-11-01T15:01:49.370 に答える
0

デザインが許せばスパン表示＝ブロックにしてみます。

span  {
    display:block;
    background-image: url("image.gif");
    background-position:right center; 
    background-repeat: no-repeat;
    min-width: 200px;
    width: 200px;}

幅を尊重するように SPAN を取得するには、これを行う必要があると思います。残念ながら、次の要素のセットを次の行にキックダウンします。

于 2012-11-01T14:53:51.013 に答える