2010-12-28 12 views
18

私には内容のないスパンがありますが、私は背景イメージ(矢印、途中)が必要です。背景イメージと内容のないスパン

問題は、背景内にコンテンツがない場合は表示されません。

どうすればこの問題を解決できますか?

+0

代わりにブロックレベルのelmentを使用してみませんか? Spanはインライン要素であり、div要素がデフォルトで行うことを行うには、display属性をブロックに設定する必要があります。 – Francisc

答えて

37

幅を設定します。スパンの高さのプロパティ。

<span style="width: 90px; height: 90px; background-image: url('bg.jpg'); display:block" /> 
+15

これは 'display:block'なしでは動作しません。 – thirtydot

+0

ディスプレイブロックは問題を解決します。ありがとうございますthirtydot – ulima69

+8

'display:inline-block'も動作します。 –

1

すなわち、内部の改行なしスペースを入れてみてください。:

<span>&nbsp;</span> 
4

設定style="padding-left:20px"

またはdisplay:block; width:20px; height:20pxと設定します。あなたはそれが自動的に他の要素の下に配置されますブロックするように設定されている場合

<span style="display:block;width:arrow_width;height:arrow_height;background-image:url('image_name');">&nbsp;</span> 
-1

あなたはこのような何かを行うことができます。 これを防止するには、インラインの利点を利用し、display:inline-blockをインラインのように配置し、高さと幅を与えることができます。 Ps:これはie7ではうまくいきません。

+0

font-sizeは違いはありません。 '幅'、 '高さ'、 '表示:ブロック'を設定する必要があります。それはすべて重要です。 – JakeParis

0

、これはyyour設計におけるいくつかの問題を引き起こす可能性があります:

関連する問題