画像やテキスト
テキスト回り込み/画像右(p
の場合)
サンプルソース
<p><img src="…" alt="…" width="…" height="…" class="visual1" />ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト</p>
テキスト回り込み/画像左(p
の場合)
サンプルソース
<p><img src="…" alt="…" width="…" height="…" class="visual2" />ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト</p>
テキスト回り込みなし/画像右
サンプルソース
<div class="visual1">
<img src="…" alt="…" width="…" height="…" />
<div class="text-area">
<p>ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト</p>
<!-- /.text-area --></div>
<!-- /.visual1 --></div>
テキスト回り込みなし/画像左
サンプルソース
<div class="visual2">
<img src="…" alt="…" width="…" height="…" />
<div class="text-area">
<p>ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト</p>
<!-- /.text-area --></div>
<!-- /.visual2 --></div>
キャプション付き画像
サンプルソース
<dl class="figure">
<dt><img src="…" alt="…" width="…" height="…" /></dt>
<dd><p class="caption">キャプションテキストキャプションテキストキャプションテキストキャプションテキスト</p></dd>
<!-- /.figure --></dl>
注意文(p
の場合)
サンプルソース
<p class="note1">注意文注意文注意文注意文注意文注意文注意文注意文注意文</p>