1 
<style type='text/css'>
#span1{
background-image:url("http://www.reoiv.com/images/rss.jpg");
background-repeat:no-repeat;
cursor:pointer;
display:block;
float:left;
height:15px;
width:15px;
vertical-align:text-bottom;
}
</style>

<span id='span1'></span>觀看次數

私がやりたいのは、垂直方向の整列を実現することです。テキストの下部の効果ですが、画像要素では実行していません。私はbackground-imageが設定された要素でそれを行っています。上記のコードをここに貼り付ける場合：http：//htmledit.squarefree.com/

テキストが垂直方向に下に揃えられなかったことがわかります。

可能であれば、html要素を追加せずにそれを行う方法を知りたいです。

みなさん、ありがとうございました。

4

3 に答える 3

4

テキストの前に span タグを閉じました:

<span id='span1'></span>觀看次數

これを使って：

<span id='span1'>觀看次數&lt;/span>

それが役立つことを願っています。

于 2010-05-11T09:24:24.903 に答える
2

フロートではそれができません。を使ってみることもできますがdisplay: inline-block、ブラウザのサポートは不完全です。

編集: http://www.quirksmode.org/css/display.html

于 2010-05-11T09:27:30.760 に答える
1

ピクセル パーフェクトな結果は得られません。これが私が使ってきた回避策です：

<span style="background: url(http://www.reoiv.com/images/rss.jpg) no-repeat left center; padding-left: 20px;">觀看次數&lt;/span>

これにより、アイコンがテキストに合わせて縦方向に中央揃えになります。padding-leftインライン要素でうまく機能します。

于 2010-05-11T09:29:09.650 に答える