タグとか、IDとか、クラスとか……それって、いったい何ですか?

あっちでも、こっちでも、
タグタグタグタブって、言うけどさ……タグって、いったい何なの?
あと、IDとかクラスってタグと違うわけ?

ホームページを作成するうえで、色々調べていると、
ふと、こんな疑問を持ったことはないですか?

管理人もイマイチわかっておりませんが、
今回は、サクッとまとめてみました。

 

タグって、なんですか?

下記のように、
<>で囲まれたものがタグです。

<p>なんちゃかんちゃら</p>

最初にある<p>を開始タグといい、
後ろにあるスラッシュ/がついた
</p>を終了タグといいます。

<>で囲まれたものは、み~~んな「タグ」と呼ぶそうです。
なので、パソコンの画面に現れる部分<body>タグ以降だけでなく、
その前にある、<head>の部分の(もちろん<head>も)
<meta>や<title>なんかも、タグになります。

因みに、Pがつけば、なんでもありで、
<p>なんちゃかんちゃら</p>のことも、
Pタグと言ったりしていますが、これは間違いだそうです。

えーー!?
じゃあ、なんて言うんだよ!

要素が正解らしいです。

要素というもの

<p>なんちゃかんちゃら</p>
の全部なんちゃらも含めて「要素」といい、
「P」が、くっついているので、「Pの要素」と、いうそうです。

因みに<>内のPのことは、「要素名」というそうです。

でも、うちのブログでは、Pタグいうだろうな~~私^^;

じゃあ、IDとか、クラスは、何者なんだよ!

ああ、あの人達は、属性と、いうらしいです。
あ、賊でも、族でも、ないですよ。
つまんないわよ!

属性って、なんじゃらほい?

ちょいと、kotobank に、聞いてみました。

コンピューターで、ファイルのもつ性質。また、表示・印刷などの際に設定する特性。アトリビュート。

kotobank より 【属性】

アトリビュート???ってなによ??

もう一度、聞いてみます。

HTMLやXMLなどの言語では、アトリビュート(属性)を付けて情報を埋め込める。

kotobank より 【アトリビュート】

何か、分かったような、分からないような……?

どうやら、何かをつけると、情報が増えるって感じでしょうかね。

属性というのは、
<要素名 属性名=”属性値”>
で表すそうです。

ああ!! 知ってるよ。
しょっちゅう見てるし、使ってるよね。
アンカーとか、イメージとか、もちろん、IDとクラスもそうだ。

<a href=”http://hpbillfirst2012.web.fc2.com/step2/2column-1.html” target=”_blank” title=”サンプルページへ”>
上は、うちの2カラムのサンプルページのアドレスです。
ここには、いっぱい属性が潜んでいます。

  • href=”url”
  • target=”_blank”
  • title=”サンプルページへ”

と、いうことで、クラスやIDは、属性ってもので、
タグに、色々な情報を埋め込む役目があるってことですね。

確かに、アンカーとかイメージなんかは、属性がないと、なんにもならないよね~~

属性には、沢山の種類があるようですが、詳しくはぐーぐる先生に聞いてくださいね。

おまけですよ

因みに、スタイルシートには、こんな名前がついています。

セレクタ{

プロパティ:値;

プロパティ:値;

}

これについては、またいずれ……!

2 Thoughts on “タグとか、IDとか、クラスとか……それって、いったい何ですか?

  1. momo on 2013年2月28日 at 13:49 said:

    ルビ様
    ルビさんはほんとうに頑張り屋なのでびっくりしています。
    ビルダーのことをもうわからない、わからないと言っていたひとが、すごいですよね!
    実はわたしが知りたかったことはこの辺なんですよ。わたしはもう、あきらめてブログのテンプレートでいいやと思ってましたけど。
    ルビさん、もう一息です。続きがみたいです。
    2カラムの完成ページがたのしみです!

  2. ルビ(管理人) on 2013年3月2日 at 09:49 said:

    momoさま
    こんにちは!
    ご訪問、そして、メッセージ、ありがとうございます。
    覘いていただけて、嬉しいです(*^_^*)
    >実はわたしが知りたかったことはこの辺なんですよ。
    フロートを使うと、途端に、
    今まで、うろ覚えで済んでいた事が、
    時に、どっと攻めて来て、パニックになりますよね(>_<)
    でも、フロートは、覚えれば、超楽しいので、
    (足し算さえ出来ればOK!)
    ぜひ、ぜひ、覚えてください。
    多分momoさまが一番興味があるのは、サイドのメニューの所ですよね。
    次回やる予定なのですが、
    今日、多分、日記をアップするので、その後ですね。
    明日!と、言いたいですが……^^;なるべく、早く頑張りますね。
    >わたしはもう、あきらめてブログのテンプレートでいいやと思ってましたけど。
    私は、逆に、ブログからの引越しを検討中です。
    と、いっても、ワードプレスなので、ブログ形式ですが……
    今日は、そのことをちょっと日記にでもしようと、思っています。
    よかったら、覘いてみてください。
    ブログはブログで、なかなか思うようにならないです(>_<)(遠い目)
    それに、あそこまで、出来ているので、あと一息だと思います。
    また、momoさまのページは、内容的にも、ブログより普通のサイトの方が、読みやすいと思います。
    私も、何度かくじけましたが、なんとかなりましたよ(多分)。
    あと、私は、頑張り屋じゃないです^^;
    このブログ、誰も見てくれていないのかな~~と思っていましたが、
    momoさまのコメントが励みになり、更新を続けています。
    感謝です!
    また、お時間ある時に、遊びにいらしてくださいね。
    お待ちしております。

コメントを残す

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Post Navigation