超初心者のためのホームページ作成講座
HTML CSS Dictionary Netscape Color AccessUp Links SiteMap

■ HTML(HyperText Markup Language)

タグというのは、文字列(テキスト)に対する命令の印です。
タグだけでもそれぞれ意味がありますが、さらに別の性質を付け加えたいときにプロパティ(属性)を使います。基本的にプロパティはとセットで書きます。正しくは、プロパティと言えば値を含めたものを指し、値だけをプロパティ値と言いますが、ここではわかりやすいように区別して書いています。

<font color="blue">悪霊退散!</font>

悪霊退散!

この場合、タグは<font>〜</font>(文字)、プロパティは color="blue"(色は青にしなさい)で、プロパティ値は blue ということになります。


タグってのは「<」と「>」にはさまれた記号で表します。
ふつうのタグは2つ合わせて一人前です。文章の頭とお尻につけてやれば、そのはさまれた文章がどうにかなるってことです。なかには1つでもちゃんと仕事するやつもいます。
こんな感じです。

1.<b>腰痛はつらいぞ!</b>
2.<font size="5">腰痛はつらいぞ!</font>
3.<font color="orange">腰痛はつらいぞ!</font>

それぞれ、

1.腰痛はつらいぞ!

文字を太くしなさい。

2.腰痛はつらいぞ!

文字の大きさを「5」にしなさい。

3.腰痛はつらいぞ!

文字の色を「オレンジ」にしなさい。

ということになります。

ちなみに「1」と「2」と「3」を合わせると・・・

<b><font size="5" color="orange">腰痛はつらいぞ!</font></b>

腰痛はつらいぞ!

文字を太くして、色を「オレンジ」にして、大きさを「5」にしなさい。

となります。


1つでもちゃんと働いてくれるタグの代表としては

1.<br>・・・改行する
2.<hr>・・・線を引く
3.<img src="ファイル名">・・・イメージを表示する

などがあります。ついでに説明しちゃうと

改行するっていうのは、画面の幅に関係なく、そこまできたら強制改行するってこと。<br> を入れないと、画面の幅によって自動改行されるし、画面が広ければ文章がいつまでも続いてしまい読みにくくなります。

線は、太さ(size)・長さ(width)・色(color)さらに、配置(align="left または center または right")を設定することができます。
注)Netscape は色(color)に対応していないみたい^^;
例えば、

<hr>

だけだと、


↑このように、何の飾りもない横線が引かれるだけですが、

<hr size="8" width="300" color="skyblue" align="center">

と書くと、


↑こうなります。

画面の真ん中(align="center")に、太さ8ピクセル(size="8")、長さ300ピクセル(width="300")でスカイブルー(color="skyblue")の線が引けました。
ここで width="300" じゃなくて、画面の幅に対しての比率をパーセントで指定することもできます。
width="50%" って入れれば、画面の幅の50%っていう意味。画面が小さくなれば、線もその分短くなります。

<img src="ファイル名"> は、画像や写真といったイメージファイル(**.gif、**.jpgなど)を表示するときに使います。同じフォルダにある場合は、ファイル名を入れるだけでいいけど、ちがうフォルダにある時は、"フォルダ名/ファイル名" となります。
正確に言うと(難しく言うと)、同じ階層にあるファイルを指定するときは "ファイル名" で、リンク元よりリンク先が下の階層にある場合は、"フォルダ名/ファイル名" となります。頭混乱してきましたね。さらに混乱させると、上の階層にある場合は、"../ファイル名" です。正確には、サーバーの場合は「フォルダ」じゃなくて「ディレクトリ」って言うらしいです。そーいえば、Windows 3.1 の頃、そう言ってたような・・・。

他のホームページにある画像を使いたいときには、<img src="URL/ファイル名"> と書きます。
URL(Uniform Resource Locator)・・・ホームページ・アドレスのこと。このサイトの URL は http://park16.wakwak.com/~html-css/


■このページに出てきたタグ■

タグ名プロパティ説明
<b>〜</b>太字
<font>〜</font>size1〜7文字の大きさ(1→7の順に大きくなる)
colorカラーネーム文字の色
<br>改行する
<hr>sizeピクセル数罫線の太さ
widthピクセル数罫線の長さ
罫線の長さ(画面に対する比率)
colorカラーネーム罫線の色
alignleft左寄せ(デフォルト)
center真ん中
right右寄せ
<img>srcURL / ファイル名イメージファイルを表示

デフォルトというのは、何も指定しない場合の表示です。
<hr> タグでは align="left" がデフォルトになっています。これは、align 属性を指定しなかった場合は左寄せで表示されるという意味です。つまり、左寄せにしたい場合は、align 属性を省略してもいいことになりますね。

<hr color="green">

<hr color="green" align="left">

2つとも同じです。