|
文字列の回りこみ
画像の横に文字列を回りこみさせる属性です。属性値を指定すると左右の回り込みが可能になります。
画像を挿入すると、画像の横には文章は一行しか表示できません。
画像の横に文章を複数行表示させたい場合は、<align>というタグを使用します。
例として、「panda_01.jpg」という画像を挿入してみます。
「panda_01.jpg」という画像は、ATP's 素材置き場さんからお借りしてきました。
素材屋さんから、素材をお借りする方法はこちら
それでは、やってみましょう。
HTML文書
|
<html>
<head>
<title>ホームページQ＆A</title>
</head>
<body>
<img src="panda_01.jpg" align="left">今日は、ホームページのお勉強をしました<br>
がんばって、かっこいいホームページを<br>
作りたいです!!<br>
</body>
</html>
|
ブラウザ表示
ALIGNの属性を下記に変更すると、様々な位置にしていして回り込みさせられます。
| top |
上にならぶ |
| center |
真ん中にならぶ |
| bottom |
下にならぶ |
<img src="画像の名前"align="位置を指定">
上部に文章を並べます↓
HTML文書
|
<img src="panda_01.jpg" align="top">
|
ブラウザ表示
中央に文章を並べます↓
HTML文書
|
<img src="panda_01.jpg" align="center">
|
ブラウザ表示
下部に文章を並べます↓
HTML文書
|
<img src="panda_01.jpg" align="bottom">
|
ブラウザ表示
|
を紹介しています。
