0

ということで、缶をイメージして持っているもの。私が望むのは、HTML では、この缶のすぐ下にテキストを表示することです。左と缶の下に他のテキストがあります。

形。

これは私が持っているものです:

<img src="URL" alt=" align="right" border="0px">

<p class="MsoNormal" style="margin-bottom: 6pt;"><span style="font-size: 20.5pt; font-family: Helvetica, sans-serif;"><span style="font-weight: bold; color: rgb(0, 0, 205);">(header)</span></span></p>

<p class="MsoNormal" style="margin-bottom: 12pt;"><span style="font-size: 14pt;"><span style="font-family: Helvetica, sans-serif; color: rgb(51, 51, 51); font-size: 14pt;">(paragraph)</span></span></p>

ここのヘッダーと段落は、缶自体に関する内容です。必要なのは、缶のすぐ下にあるテキストです。ありがとうございました。

4

2 に答える 2

2

画像とそれに付随するテキストを、たとえば div 要素内に配置します。

<div class="img-wrapper">
    <img src="" alt="" />
    <p class="img-desc">(Image caption)</p>
</div>

次に、スタイルを設定します。

<style>
    .img-wrapper {
        float: right;
        margin: 0 0 0.5em 1em;
    }
    img {
        display: block;
        margin: 0 auto;
    }
    .img-desc { text-align: center; }
</style>

各要素でスタイルを「インライン」に設定することは本当に避けるべきです。これにより、コードの保守が難しくなります。これらのスパン要素を使用する必要はありません。p 要素のクラスを参照して、テキストのすべてのスタイルを設定するだけです。

于 2013-05-09T02:18:04.473 に答える
0

HTML では、結果を達成する唯一の方法は、テーブルを使用してimg要素を置き換えることです。

<table align=right>
<tr><td><img src="URL" alt="...">
<tr><td>Text under the image
</table>

CSS を使用すると、他の代替手段も可能です。

于 2013-05-09T07:38:49.617 に答える