id属性の使用
この id属性は、HTML要素の一意のIDを指定します（値はHTMLドキュメント内で一意である必要があります）
id値をCSSおよびJavaScriptで使用して、特定のid値を持つ要素に対して特定のタスクを実行できます
CSSで、特定のIDを持つ要素を選択するには、ハッシュ（＃）文字を記述し、その後に要素のIDを続けます:
例文
CSSを使用して、「myHeader」というIDを持つ要素をスタイルします。:
<style>
#myHeader {
background-color: lightblue;
color: black;
padding:
40px;
text-align: center;
}
</style>
<h1 id=”myHeader”>My Header</h1>
結果:
My Header
ヒント: id属性は、任意 の HTML要素で使用できます。
ノート: id値は大文字と小文字が区別されます。
ノート: id値には少なくとも 1 文字 を含める必要があり、空白（スペース、タブなど）を含めることはできません。
クラスとIDの違い
HTML要素は、その単一の要素に属する一意のIDを1つしか持つことができませんが、クラス名は複数の要素で使用できます。:
例文
<style>
/* Style the element with the id “myHeader”
*/
#myHeader {
background-color: lightblue;
color: black;
padding:
40px;
text-align: center;
}
/* Style all
elements with the class name “city” */
.city
{
background-color: tomato;
color: white;
padding: 10px;
}
</style>
<!– A unique element –>
<h1 id=”myHeader”>My
Cities</h1>
<!– Multiple similar elements –>
<h2 class=”city”>London</h2>
<p>London is the capital of England.</p>
<h2 class=”city”>Paris</h2>
<p>Paris is the capital of France.</p>
<h2 class=”city”>Tokyo</h2>
<p>Tokyo is the capital of Japan.</p>
IDとリンク付きのブックマーク
HTMlブックマークは、読者がWebページの特定の部分にジャンプ出来るようにするために使用されます。
ブックマークは、Webページが非常に長い場合に役立ちます。
ブックマークを作成するには、まずブックマークを作成してから、リンクを追加する必要があります。
リンクをクリックすると、ページはブックマークのある場所までスクロールします。
例
最初に id 属性を使用してブックマークを作成します。:
<h2 id=”C4″>Chapter 4</h2>
次に、同じページ内からブックマークへのリンク（”Jump to Chapter 4″), を追加します。:
<a href=”#C4″>Jump to Chapter 4</a>
または、別のページからブックマークへのリンク（”Jump to Chapter 4″), を追加します。:
例文
<a href=”html_demo.html#C4″>Jump to Chapter 4</a>
JavaScriptでid属性を使用する
JavaScriptは、次の getElementById() メソッドを使用して、指定されたIDを持つ要素にアクセスできます。:
例文
id属性を使用して、JavaScriptでテキストを操作します。:
<script>
function displayResult() {
document.getElementById(“myHeader”).innerHTML = “Have a nice day!”;
}
</script>