属性
初級読み方：ぞくせい｜英語：Attribute
タグに追加情報を与えるもので、開始タグの中に書くよ。例：href, src, alt, class, id。いつ使う？ リンク先を指定する（href）、画像のパスを指定する（src）、スタイルを当てる対象を決める（class）など、タグに「詳しい設定」を加えたいときに使うよ。間違いやすいポイント: 属性名と値の間に=を書き忘れたり、値をクォーテーション（""）で囲み忘れたりするとエラーになるよ。
やさしい説明
属性（ぞくせい）とは、タグに追加情報を与えるものです。開始タグの中に 属性名="値" の形で書きます。
タグが「ラベル」だとすると、属性は「ラベルに書き込むメモ」です。例えば、リンクタグ <a> だけでは「リンクを作りたい」ことしかわかりません。href="..." という属性を付けて初めて「どこにリンクするか」が決まります。
属性はたくさんの種類があります。リンク先のURL（href）、画像のパス（src）、説明文（alt）、クラス名（class）などが代表的です。
1つのタグに複数の属性をつけることもできます。スペースで区切って並べます。
具体例・使い方
属性の使い方を見てみましょう。
<!-- href属性でリンク先を指定 -->
<a href="https://example.com">サイトへ</a>
<!-- src属性で画像パス、alt属性で説明文 -->
<img src="cat.jpg" alt="かわいい猫の写真">
<!-- class属性でCSSのスタイルを適用 -->
<div class="card">カード内容</div>
<!-- type属性で入力欄の種類を指定 -->
<input type="email" placeholder="メールアドレス">いつ使う？
リンクを作るとき（href）、画像を表示するとき（src, alt）、CSSでデザインを当てるとき（class）——HTMLを書くときはほぼ毎回属性を使います。
間違いやすいポイント
❌ 属性値のクォートを忘れる
<!-- ❌ クォートがない（エラーになることがある） -->
<a href=https://example.com>リンク</a>
<!-- ✅ ダブルクォートで囲む -->
<a href="https://example.com">リンク</a>❌ 属性名のスペルミス
herf（正しくは href）、scr（正しくは src）のようなタイポは、リンクや画像が動かない原因になります。エディタの補完機能を活用しましょう。
よくある疑問
Q: 属性の順番は決まっている？
A: 順番は自由ですが、慣例としてclass、id、src、href、altの順に書くことが多いです。
Q: 属性の値にスペースを入れていい？
A: class属性は複数のクラス名をスペースで区切れます（class="box red"）。それ以外の属性でスペースを入れると意図しない動作になることがあります。
Q: 属性を書く位置はどこ？
A: 開始タグの中、タグ名の後にスペースを空けて書きます。例: <a href="url">リンク</a>。終了タグには属性を書けません。
関連用語
📖 関連レッスン
レッスンを見る →