HTML講座

手打ちのHTML講座その4 ~余談「属性って何?」~

1.属性と呼ばれるもの

前回まででテーブルの組み方を学びました。

その中でタグで線の太さをしているする「border="〇"」というものを入力したのを覚えていますでしょうか?

他にも<td>タグで使用する「width="〇"」「colspan="〇"」など入力もしましたね。

この「border="1"」のようにタグ内に記述するものを「属性」と言います

「border」が属性であり、「1」の部分を属性値と言います。

属性とはタグをどのようなものにするかという設定と考えてください。

この「属性」は<table>だけでなく<tr>や<td>、さらにはいろんなところで登場し、幾らでも入力できますが

それぞれで使用出来る「属性」は決まっています。

2.どういうことなの?

「いろんなところで登場」して「いくらでも入力出来る」のに「使用出来る属性は決まっている」ってどういうこと?と思うことでしょうから、ちょっとゲーム風に言いつつ、そしてhtmlの記述風に表現していきましょう。

3.風悟というキャラクターを作る

3-1.何の個性もない風悟

まず、ここに「風悟」というキャラがいます。

HTMLで表現すると

風悟

何の個性もありません。

3-2.風悟に剣と盾を装備させる

今何も装備していない風悟というキャラに剣と盾を装備させます。

これをHTML風に記述すると

<剣><盾>風悟</盾></剣>

風悟を<剣>タグと<盾>タグで挟むことで装備させました。

剣と盾は何の属性も入力していない(どういった剣と盾か設定していない)ので、風悟はありきたりな剣とありきたりな盾を装備しているはずです。

3-3.剣と盾に属性(設定)を追加する

では属性を設定していきましょう。

剣は刃渡り1.5m、材質は銀製、切れ味は抜群。盾は形状は円形、材質は木製とします。

これをHTML風に記述すると

<剣 刃渡り=”1.5m” 材質=”銀製” 切れ味=”抜群”><盾 形状=”円形” 材質=”木製>風悟</盾></剣>

剣には「刃渡り」「材質」という属性を、盾には「形状」「材質」という属性を与えました。

先ほどまではありきたりな剣と盾を装備していた風悟は

「よく斬れる銀製の長い剣」と「木製の丸い盾」というアンバランスな装備になりました。

4.「いろんなところで登場」して「いくらでも入力出来る」のに「使用出来る属性は決まっている」

さて、話を戻してみましょう。

<剣 刃渡り=”1.5m” 材質=”銀製” 切れ味=”抜群”><盾 形状=”円形” 材質=”木製>風悟</盾></剣>

こうしてHTML風装備をした風悟が完成しました。

この中で「<剣>」「<盾>」というタグがあり、

その中で属性は「刃渡り」「材質」「切れ味」「形状」が登場しました。

属性は「<剣>」「<盾>」といろんなところで登場しました。

そして「<剣>」では「刃渡り」「材質」「切れ味」といくらでも入力できます。

一方で入力してないものの「<盾>」では「切れ味」という属性を設定出来ないだろう、とわかると思います。

つまりすべての属性を使えるわけでもなく、使用出来る属性はタグ毎に決まっているわけです。

例が少な過ぎて「いろんなところ」「いくらでも」と言われてもピンと来ないかもしれませんが

雰囲気は理解出来るかなと思います。

5.属性は意外と色んなところで同じものが使える

HTML装備では「刃渡り」「材質」「切れ味」「形状」という属性がありました。

<盾>タグで「刃渡り」という属性は使えませんと書きました。

しかし、どんどん勉強していくと<床>というタグが登場したとしましょう。

すると「もしかすると<床>タグでは「材質」属性が使えるのでは?」と感じるでしょう。

使えるかもしれませんし、使えないかもしれません。

実際のHTMLにおいても同じことが言えます。

使えるものもありますし、使えないこともあります。

あれっ、この属性はここで使えるのでは?と感じたら試しに使ってみてもいいかもしれませんね。

書くだけなら誰も困りませんからね(

1

トレーナーからの呼び方については地の文ではフルネームが多いので、声に出す際の愛称があればそちらを優先して記載します

-HTML講座
-,