徘徊老人之頁/これまで習ってきたことの覚え書き

>【これまで習ってきたことの覚え書き】

●ホームページの基本形：

<html>
<head>
<title>
</title>
</head>
<body>
</body>
</html>

・タグは<はじめ>と</おわり>の構造になっている。
・<html>ではじまり</html>で終わることで、ＨＴＭＬで表示されることを意味する。
・<title>と</title>の間の文字は、ブラウザのタイトルバーに表示される文字。
・<head>と</head>の間の部分は、ブラウザでは見えないが、重要な部分。
……検索エンジンがこの部分の中身を読み取る、らしい。
・<body>と</body>の間に書かれていることが、ブラウザに表示される。

☆注意：
・タグは必ず「半角小文字」で打ち込むこと。(→追記：「半角大文字」でも０Ｋみたいだ)
・index.htmもしくはindex.htmlは特別なファイル、らしい。

●背景色：bgcolor="#カラーコード"
・<body>のタグの「body」の文字の後ろに、「半角スペース」を置いて「bgcolor="#カラーコード"」で指定する。
・カラーチャート表はこちら。

・つまり<body bgcolor="#CCCCFF">なんたらかんたら文章……</body>というふうになる。

●改行：<br>
・<br>単独で改行となる特殊なタグ。

●ライン(区切り線)：<hr>
・<hr>単独で区切り線となる特殊なタグ。
・区切り線の長さの指定……<hr>のタグの「hr」のあとに「半角スペース」を置いて、「width="○%"」。
・区切り線の色の指定……<hr>のタグの「hr」のあとに「半角スペース」を置いて、「color="#カラーコード"」。
・例<hr width="80%" color="#3300CC">

☆注意１：
・<hr>の後に打ち込んだ文字は、自動的に改行される、みたいだ。
・つまり<hr><br>とすると、区切り線のあと、１行空いてしまう。
☆注意２：
・ラインの長さを指定した場合、Winでは、そのままではセンター合わせとなる。
・左寄せにしたい場合は……<hr align="left" width="数字%" color="#カラーコード">
・右寄せにしたい場合は……<hr align="right" width="数字%" color="#カラーコード">
　――というふうにする。

●本文フォント：<basefont size="数字" color="#カラーコード">
・<body bgcolor="#カラーコード">の次行に上記タグを入れる。
・一般的な文字の標準サイズは「３」。
・本文途中での文字サイズの変更は……<font size="数字">変更したい文字</font size>
・本文途中での文字色の変更は……<font color="#カラーコード">変更したい文字</font color>

↑※追記：今まで誤解していたようだが、本文文字のサイズや色の変更タグの終わりは</font>のみで０Ｋのようだ。
(</font size>や</font color>としても機能的には同じ)

・文字色と背景色のバランスチェックはこちらで確認すると楽チン♪

●画像の貼り付け：<img src="./img/画像ファイル名.jpg">
・index.htmlより下層のフォルダに『img』を作り、そこに画像ファイルを入れておく。
・表示時間が長くならないよう、なるべく軽いファイルにするよう心がける。
・他のサイトにある画像から持ってきて表示させるには、<img src="http://*******.jp/img/???.jpg">というようなタグになる。

●テーブル：<table>……</table>
・実際のテーブルでは<table width="数字" border="数字" cellspacing="数字" cellpadding="数字"> のように、枠線とセルに関する指定をする。
・「width="数字"」……横幅の指定
・「border="数字"」……枠線の太さの指定(「０」は枠線なし)
・「cellspacing="数字"」……セル内枠の隙間の指定
・「cellpadding="数字"」……セルの中に入っているもの(文字・画像)とセルの端までの間隙の指定

☆注意：
・テーブルダグはあくまでも、「この部分はテーブルですよ」との宣言なので、実際にはテーブルタグの間に、セルのタグを意味をなさない。(※次の「行と列」参照)
・例<table width="100" border="1" cellspacing="2" cellpadding="2"></table>を実際に表示するとこうなる。

●テーブルの行と列：<tr><td>……</td></tr>
・<tr>……</tr>で、１行分のセルの内容を記述する。
・<td>……</td>で、上記１行分の個々の列の内容を記述する。
・例：

行＼列	Ａ列	Ｂ列	Ｃ列
１行	１行目Ａ列	１行目Ｂ列	１行目Ｃ列
２行	２行目Ａ列	２行目Ｂ列	２行目Ｃ列
３行	３行目Ａ列	３行目Ｂ列	３行目Ｃ列

上記のテーブルをタグであらわすと、次のようになる。

つまりテーブルは、最低限
<table border="数字"><tr><td>文字(or画像データ)</td></tr></table>
のタグがないと、意味をなさない。
［Top/今日/第11回/９回・10回/第８回/第７回←

→アヤシイ知識/タグ単/プロフ］