すばるの
ページ
練習5
2019年02月08日 作成
2020年06月18日 更新
文字や写真を中央に表示する
文字や写真などを、画面の中央に表示するときは <center> タグ を使います。

img (イメージ) を 中央 にする例。
<html>
私は○○です。<br>
<center>
<Img Src="ファイル名" width=500><br>
</center>
</html>
赤い文字の <center> が位置の指定です。

<center> タグは文字や写真などを左右の中央に整列させます。
中央整列を解除するには </center> で解除します。

写真を 左 に寄せる
画面の左に写真を置いて、右に文書を表示するにはイメージタグに align="left" を追加します。
img (イメージ) タグに横幅と位置 (左) を追加した例。
<html>
私は○○です。<br>
<Img Src="ファイル名" width=500 align="left"><br>
この写真は私の手です。<br>
大きいのが自慢です。<br>
</html>
赤い文字の align="left" が配置の指定です。

写真のイメージタグに align="left" を追加すると、写真は左側に表示されます。
文字は、写真右側のスペースに表示されます。
写真
この写真は私の手です。
大きいのが自慢です。
画面の左に写真を配置した例

文字は写真をよけて、空いた部分に表示されます。 文書が長い場合は写真の下にも表示されます。 文書が短いときなど、全てを改行したいときは
<br>タグに clear="all" コマンドを追加して <br clear="all"> とします。

写真を 右 に寄せる
画面の右に写真を置いて、左に文書を表示するにはイメージタグに align="right" を追加します。
img (イメージ) タグに横幅と位置 (右) を指定した例。
<html>
私は○○です。<br>
<Img Src="ファイル名" width=500 align="right"><br>
この写真は私の手です。<br>
大きいのが自慢です。<br>
</html>
赤い文字の align="right" が配置の指定です。
この写真は私の手です。
大きいのが自慢です。
写真
画面右側に写真を表示した例
練習1  練習2  練習3  練習4  ホームページの仕組み  htmlの勉強  ウィルスに感染したとき