■改行 |
|
|
まずは、右の「sample11.html」を試してみて下さい。(私の手がけるサイトばかりで恐縮ですが・・・^^;)
sample11.html |
<HTML> <BODY BACKGROUND="lightpnk.gif">
<FONT COLOR=CHOCOLATE SIZE=6>
<B><I>FujiMan Production</I>のホームページ</B>
</FONT>
<B>お気に入りサイト・ベスト3</B>
俳優・阿南健治ホームページ
FujiMan Production
中国労災病院
</BODY> </HTML>
|
これは「sample10.html」に赤字の部分を書き加えたものですが、意図した結果になりませんでしたね。(^^)
そうです。HTML文書上で行を変えて(改行して)書いても、ブラウザ上では繋がった文字列になってしまうんです。
HTML文書は「ブラウザに対しての指示書」と説明しましたが、行を変える・・・つまり、「改行する」という指示が記述されなかったために、
このような結果になったんです。
sample12.html |
<HTML> <BODY BACKGROUND="lightpnk.gif">
<FONT COLOR=CHOCOLATE SIZE=6>
<B><I>FujiMan Production</I>のホームページ</B><BR><BR>
</FONT>
<B>お気に入りサイト・ベスト3</B><BR><BR>
俳優・阿南健治ホームページ<BR>
FujiMan Production<BR>
中国労災病院<BR>
</BODY> </HTML>
|
改行するためには、<BR>タグを使います。このタグには終了タグがなく単独で使います。
「sample12.html」のように<BR>タグを書き加えてみましょう。
ちょっと面倒なようですが、結構多用するタグですので慣れれば問題なく使えるでしょう。
|
|
■リスト |
|
|
サンプルのような箇条書きのものならリストタグが利用できます。
sample13.html |
<HTML> <BODY BACKGROUND="lightpnk.gif">
<FONT COLOR=CHOCOLATE SIZE=6>
<B><I>FujiMan Production</I>のホームページ</B><BR><BR>
</FONT>
<B>お気に入りサイト・ベスト3</B><BR><BR>
<UL>
<LI>俳優・阿南健治ホームページ
<LI>FujiMan Production
<LI>中国労災病院
</UL>
</BODY> </HTML>
|
箇条書き・・・リストにしたい部分を赤字のように<UL>〜</UL>で囲みます。
それぞれの項目の頭に<LI>を付ければOKです。こうすれば、改行タグ(<BR>)は要りません。
どうでしょう?・・・らしくなりませんか。(^^;
<UL>〜</UL>を<OL>〜</OL>に変えると
「番号つきリスト」になります。試してみて下さい。
|
|
■定義型リスト |
|
|
「お気に入りサイト」の紹介ということで、折角ですからホームページ・アドレス(URL)を載せましょう。
こういう場合は「定義型リスト」を利用すると便利です。
sample14.html |
<HTML> <BODY BACKGROUND="lightpnk.gif">
<FONT COLOR=CHOCOLATE SIZE=6>
<B><I>FujiMan Production</I>のホームページ</B><BR><BR>
</FONT>
<B>お気に入りサイト・ベスト3</B><BR><BR>
<DL>
<DT>俳優・阿南健治ホームページ
<DD>https://homepage1.nifty.com/anannoken/
<DT>FujiMan Production
<DD>https://FujiMan.net
<DT>中国労災病院
<DD>https://www.chugokuh.rofuku.go.jp/
</DL>
</BODY> </HTML>
|
定義型リストにする場合は、<DL>〜</DL>を使います。
よく見てくださいね。それぞれの項目が「定義文(<DT>)」と「その解釈文(<DD>)」のふたつの部分から成っていますね。
これが「定義型リスト」です。
「定義文」を太字(<B>〜</B>)にするとか、文字の色を変えるとか、いままで説明したタグを使ってメリハリを付けると、もっと見やすい感じになると思います。
語句の説明とか、自己紹介(プロフィール)とか、書籍や音楽の紹介、などなどと、いろいろに利用できそうですね。
|
|