id属性とは
今後HTMLをやっていく上で、id属性は絶対に必要になってくるものです。id属性というのは、たくさんある要素の中でどれが誰なのかを分かりやすくするために個別に付ける名前のようなものだと憶えておきましょう。その名前のこと（値）を「ID名」だったり「識別子」と呼んだりします。（これは特別覚える必要はない気がする）
id属性で気を付けること
idは同じものを使うことができません。あなたも「山田」、そこのあなたも「山田」というのは不可能だということです。
ちなみにこのidについても、日本語名を付けるのは避けたほうが良いと思われます。なぜならばjavascriptで使用する可能性があるのと、基本的に日本語を付けるのは避ける（何かとトラブルのもとになるので）のが暗黙の了解ってところがあるからです。
id属性の書式について
id属性はほとんどの要素につけることができます。つける方法としてはこうです。↓
<要素名 id="個別名">例をあげるならばこんな感じ。
<div id="ichimonji">CSSの場合はid名の前に#を付ける↓
#id名{
装飾内容
}id属性の活用方法
- ページ内リンク
- フォームを便利にする
id属性の活用方法については、主にページ内リンクだったり、Javascriptでの使用になります。ページ内リンクは目次のような機能を果たしてくれます。こちらの記事に詳しいことを書いていますので気になる方はこちらからどうぞ。↓
またJavascriptでは、個別に何かしらのアクションを付加することが可能です。
例えば画像に何かしらのアニメーションを付けたり、ボタンをクリックすると枠の色を変えたりなど表現方法を色々と工夫することができます。
フォームを便利にするというのは説明すると分かりづらいと思うので実際に記事を見てみてください。↓
class属性について
idと似たようなものでclassというものもありますが、こちらは何度でも同じ名前を使用すること（複数の要素に付けること）が可能です。同じHTML内で何度でも使用できます。
classはその名の通りクラスのようなもので、小学校で言う１学年のAクラス、Bクラス、Cクラスのクラスと同じような意味を持っています。
主にどのような時に使うかというと、特定の要素に対して同じ装飾を付ける場合に使用します。例えば山田さんだけ背が高くなる魔法をかけますよ～みたいな感じです。
html内のclassの書き方
classは特定の効果を付与させたい要素の後に、半角スペースを空けてclass名を指定します。
<div class="クラス名">CSS内のclassの書き方
CSSの場合、クラス名の頭に.を付けることによって指定できます。
.クラス名{
}クラスは複数指定することも可能です。詳しいことはこちらを見てみてください。