見出しと強調を使ってコンテンツを整理しよう

作成ファイル・保存場所

作成したhtml-basic フォルダの中に html02.html というファイル名で保存してください。

目的

複数の見出しタグ（<h1>〜<h3>）を使って文章構成の階層を学び、インライン要素（<em>・<i>・<strong>など）で適切に強調する方法を習得する。 <strong> は「文脈上の重要性・警告・強調」に使うタグで、たとえば「重要なお知らせ」などに該当します。
意味として重要でない場合は、使用しなくても問題ありません。

指示

以下の条件に従って、HTMLファイルを作成してください。

HTMLの基本構造は前回と同様に記述すること
タイトルは「HTML課題02」とすること
<h1> タグで全体のタイトル「私の趣味紹介」と表示すること
以下のような構成で見出しと本文を組み立てること

HTMLの解答例

基本のコードが間違っていないか確認しましょう

<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <title>HTML課題02</title>
</head>

<body>
    <h1>私の趣味紹介</h1>

    <h2>音楽を聴くこと</h2>
    <p>特に <em>クラシック音楽</em> や <i>映画音楽</i> をよく聴きます。</p>

    <h2>カフェ巡り</h2>
    <h3>お気に入りのカフェ</h3>
    <p>地元の <i>隠れ家的カフェ</i> を探すのが好きです。</p>

    <h2>読書</h2>
    <p>ビジネス書や <em>自己啓発本</em> をよく読みます。</p>
</body>

</html>

プレビュー

画面上で右クリックし、Open with Live Serverを起動。（プラグインのLive Serverが必要です)