前へ 目次 次へ

float, clear

style25.css
.imgright{
	float: right;
}
.rightclear{
	clear: right;
}
css25s1.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<title>border style</title>
<meta http-equiv="content-type" content="text/html;charset=Shift_JIS">
<link rel="stylesheet" href="style25.css" type="text/css">
<body>
<img src="../html/robot02.png" alt="ロボットのイラスト"
 class="imgright">
<p>img要素のalign属性によって画像を配置した場合、
その反対側にはテキストを表示することができます。
align属性では、画像の配置位置としてleftとrightを取ることができます。
この属性も推奨されておらず、
スタイルシートで置きかえるほうが良いと説明をしました。
スタイルシートではfloatを用いて同様の効果を出すことができます。</p>
<p class="rightclear">
テキストの回り込みを解除するには、
clearを利用します。</p>
</body>
</html>

クリックすると表示結果をみることができます

2003//()

トップページへ

SEO [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送