HTML編 13/51
| 目的別 index | タグ別 index | カラーチャート | images | SAMPLE |
レイアウト
コメントタグを使う
真ん中に表示する




コメントタグを使う

●<!-- -->
そろそろタグを書くことに慣れてきた頃かと思います。だんだん、HTMLも長くなってきました。この状態がずっと続くと(続きますが・笑)HTMLファイルの中でどこがどの部分だったか、解らなくなりがちです。
そこで登場するのがコメントタグです。HTMLの中に文字を書いてしまうと全てブラウザに表示されてしまいますが「<!--」と「-->」の間に書かれた文字はブラウザに表示されませんので、HTMLの中にメモ書きしておくことができます。自分が作ったHTMLを他人が更新作業をする場合などにも、他の人から見てこのタグはどの部分なのか伝えるにも有効です。どんどん活用しましょう。

<!--★★この部分はブラウザには表示されません★★-->

中に目立つマークを入れておくのも一つの手です。上の例は★★を入れてコメント部分を目立つようにしています。
View
<HTML>
<HEAD>
<TITLE>ようこそ!Kimura's Roomへ</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=Shift_JIS">
</HEAD>
<BODY BGCOLOR="#ececec">
<H2>ようこそ!</H2>
<!--★★タイトルの部分★★-->
<FONT SIZE="7" COLOR="#009900" FACE="Times New,Times,Times Roman"><B><I>Kimura's Room</I></B></FONT><BR>
<!--★★四角のグラデーション部分ここから★★-->
<FONT SIZE="2" COLOR="#0000ff">◆</FONT>
<FONT SIZE="2" COLOR="#3300ff">◆</FONT>
<FONT SIZE="2" COLOR="#6600ff">◆</FONT>
<FONT SIZE="2" COLOR="#9900ff">◆</FONT>
<FONT SIZE="2" COLOR="#cc00ff">◆</FONT>
<FONT SIZE="2" COLOR="#ff00ff">◆</FONT>
<FONT SIZE="2" COLOR="#ff00cc">◆</FONT>
<FONT SIZE="2" COLOR="#ff0099">◆</FONT>
<FONT SIZE="2" COLOR="#ff0066">◆</FONT>
<FONT SIZE="2" COLOR="#ff0033">◆</FONT>
<FONT SIZE="2" COLOR="#ff0000">◆</FONT>
<!--★★四角のグラデーション部分ここまで★★-->
</BODY>
</HTML>




真ん中に表示する

●<CENTER>
最初の方でちょっとやりました。<CENTER>タグです。テキストでも画像でもテーブルでも、このタグで挟んだ物はみんな真ん中に揃うという、単純明快なタグです。ただし、タグによっては次にやるALIGN="center"オプションを使える物もあります。<CENTER>は非常に手軽で便利なタグですが、ALIGNを使える物はALIGNを使うことが正しいHTMLですので、出来るだけそちらを使いましょう。とりあえず、全体を挟んでみました。
View
<HTML>
<HEAD>
<TITLE>ようこそ!Kimura's Roomへ</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=Shift_JIS">
</HEAD>
<BODY BGCOLOR="#ececec">
<CENTER>
<H2>ようこそ!</H2>
<!--★★タイトルの部分★★-->
<FONT SIZE="7" COLOR="#009900" FACE="Times New,Times,Times Roman"><B><I>Kimura's Room</I></B></FONT><BR>
<!--★★四角のグラデーション部分ここから★★-->
<FONT SIZE="2" COLOR="#0000ff">◆</FONT>
<FONT SIZE="2" COLOR="#3300ff">◆</FONT>
<FONT SIZE="2" COLOR="#6600ff">◆</FONT>
<FONT SIZE="2" COLOR="#9900ff">◆</FONT>
<FONT SIZE="2" COLOR="#cc00ff">◆</FONT>
<FONT SIZE="2" COLOR="#ff00ff">◆</FONT>
<FONT SIZE="2" COLOR="#ff00cc">◆</FONT>
<FONT SIZE="2" COLOR="#ff0099">◆</FONT>
<FONT SIZE="2" COLOR="#ff0066">◆</FONT>
<FONT SIZE="2" COLOR="#ff0033">◆</FONT>
<FONT SIZE="2" COLOR="#ff0000">◆</FONT>
<!--★★四角のグラデーション部分ここまで★★-->
</CENTER>
</BODY>
</HTML>

backindexnext