2

こんにちは、前の画像の後に画像を追加するステータスバーを作成しようとしています。わかりやすく説明しましょう。

私は2つの画像（gif）を持っています。白 10x10px と黒 10x10px を推測します。

このタグ<Img src='./black.gif>はホームページで使用しています。<Img src='./white.gif>の後に置きたい<Img src='./black.gif>。

最終的にはこんな感じ

■□□■■□■□■

HTMLを使用して行うことは可能ですか? または任意の良いアイデア？

- - - - -追加

ありがとう。実際にはもっと多くの画像を持つことができますが、それは修正されていません。たとえば、1-3(緑) 4-7(黄) 8-10(赤) のような値に対応する画像を追加したい。そして、ハイチャートの動的更新からのデータ。

4

3 に答える 3

0

jQueryで見つけました。解決策は、「追加」を使用して、img を div コンテナーでラップすることです。

と

$('#image_status').append('');

于 2013-04-16T15:52:06.790 に答える
0

解決策 1 (推奨):

background-repeatプロパティを使用して、Photoshop を使用して黒と白の四角で 1 つの画像を作成できないのはなぜですか? これができない場合は、以下の別の解決策を参照してください。

解決策 2:

画像を でラップして、divを与えることができますfloat: left:

HTML:

<div>
    <div class="image_cont">
        <img src="white.jpg" />
    </div>
    <div class="image_cont">
        <img src="white.jpg" />
    </div>
</div>

CSS:

.image_cont{
    float: left; /* OR display: inline-block  OR  width: xx px */
}

作業例 (JSFiddle)

于 2013-04-16T02:18:20.367 に答える
-1

画像を div コンテナーでラップし、id (id) を割り当ててから、次の css プロパティを使用します。

div#id img{
display: inline-block;
}

jsfiddle

于 2013-04-16T02:39:33.313 に答える