今作ったWebページの写真の人物紹介を書きます. まずはじめに自分の顔写真とその説明を 1つの段落に書いてみます.
<hr>
の下に,
次の記述を加えます.
<p><img class="persons" src="myface.jpeg" alt="MyFace"> 私がこのページの作者の xxx です。数理科学科の1年生です. xxx と呼んで下さい. よろしくお願いします.(文章は自分で適当に考えたものを書く.) <br class="next"> </p>
img
タグの class 属性も, スタイルシートで記述します.
注意:
次のスタイルシートに書く内容ですが, 写真は float 属性をもたせて,
文章に囲まれるようにします. この際に, この囲みを解除するのが,
clear というプロパティ(property, 性質)です.
スタイルシートでは, 改行タグ<br>
にこの clear という属性を指定しています.
このような指定をしないと, 画像は行の中の文字と同じ扱いになります.
このようなスタイル(見せ方)の指定は, HTML ファイル内で行っても良いのですが, 「見た目と論理構造の分離」ということを意識していただくために, あえて スタイルシートを別ファイルで作成します.
出来たら, 上書き保存し, Firefoxの「再読み込み」の操作を行って下さい.
2023-06-10