はじめに
HTML の <em> タグは、Web ページ上の特定のテキストに強調または重要性を追加するために使用されます。特定のコンテンツを強調して目立たせるのに非常に役立ちます。この実験では、HTML で <em> タグをどのように使用するかとその基本構文について学びます。
注：
index.htmlでコーディングを練習し、Visual Studio Code で HTML を記述する方法 を学ぶことができます。画面右下の「Go Live」をクリックして 8080 ポートで Web サービスを実行します。その後、Web 8080 タブを更新して Web ページをプレビューできます。
見出しの追加
まず、index.html という名前の HTML ファイルを作成し、好きなコードエディタで開きます。
HTML ファイルにタイトルの見出しを追加してみましょう。index.html ファイルに次のコードを入力します。
<!doctype html>
<html>
<head>
<title>HTML Em Tag Lab</title>
</head>
<body></body>
</html>
HTML のタグを使用する
これで HTML ファイルを作成したので、<em> タグを使用してみましょう。次の数ステップでは、このタグの使い方と基本構文について学びます。
HTML ファイルに短い段落を追加し、特定の単語を強調するために <em> タグを使用しましょう。以下は例です。
<p>HTML <em>Emphasized</em> text is important for your web page.</p>
さらに強調されたテキストを追加する
文の中の複数の単語を強調する場合も、<em> タグを使用できます。以下は例です。
<p><em>HTML</em> stands for <em>HyperText Markup Language.</em></p>
CSS を使って HTML のタグをスタイリッシュにする
デフォルトでは、強調されたテキストは斜体で表示されます。ただし、CSS を使って <em> タグのスタイルをカスタマイズすることもできます。以下は例です。
<style>
em {
font-style: normal;
font-weight: bold;
}
</style>
<p><em>CSS is</em> used to style HTML web pages.</p>
リンクの追加
リンク内でも <em> タグを使って、アンカー テキストを強調することができます。以下は例です。
<a href="https://www.wikipedia.org"
><em>Wikipedia</em> is a free online encyclopedia.</a
>
まとめ
おめでとうございます！この実験では、HTML の <em> タグと、Web ページ上のテキストに強調や重要性を追加するためのその使い方を学びました。また、CSS を使って <em> タグのスタイルをカスタマイズする方法も学びました。HTML タグと要素の達人になるために練習を続けましょう。
