<h2>hタグとは</h2>


<h3>見出しを実装する際に使うタグです。</h3>


<h4>h1タグは1ページに1つのみの使用が推奨されています。</h4>

<h5>他のhタグは何度でも使えます。</h5>
<h6>順番に気を付けて使いましょう。</h6>

body {
  line-height: 2;
}
h2 {
  font-size: 28px;
  font-weight: bold;
}
h3 {
  font-size: 20px;
  font-weight: bold;
}
h4 {
  font-size: 18px;
}
h5 {
  font-size: 16px;
}
h6 {
  font-size: 12px;
}


<h2~h6>

hタグとは


見出しを実装する際に使うタグです。


h1タグは1ページに1つのみの使用が推奨されています。

<h5>他のhタグは何度でも使えます。</h5>
<h6>順番に気を付けて使いましょう。</h6>


    // =======================
    // テストコード
    // =======================
    const questions = [
        {
            title: '「hタグとは」をh2タグで囲んでみよう',
            tests: [
                {
                    title: 'エディター内のテキスト **hタグとは** を`*<h2>*`タグで囲んでください。',
                    hint: '`<h2>hタグとは</h2>`と記述してください。',
                    test: () => isContainTextInEditor('<h2>hタグとは</h2>')
                }
            ]
        },
        {
            title: '「見出しを実装する際に使うタグです。」をh3タグで囲んでみよう',
            tests: [
                {
                    title: 'エディター内のテキスト **見出しを実装する際に使うタグです。** を`*<h3>*`で囲んでください。',
                    hint: '`<h3>見出しを実装する際に使うタグです。</h3>`と記述してください。',
                    test: () => isContainTextInEditor('<h3>見出しを実装する際に使うタグです。</h3>')
                }
            ]
        },
        {
            title: '「h1タグは1ページに1つのみの使用が推奨されています。」をh4タグで囲んでみよう',
            tests: [
                {
                    title: 'エディター内のテキスト **h1タグは1ページに1つのみの使用が推奨されています。** を`*<h4>*`で囲んでください。',
                    hint: '`<h4>h1タグは1ページに1つのみの使用が推奨されています。</h4>`と記述してください。',
                    test: () => isContainTextInEditor('<h4>h1タグは1ページに1つのみの使用が推奨されています。</h4>')
                }
            ]
        }
    ];


見出しを実装しよう（h2-h6タグ）

<h1>

見出しを実装しよう（h1タグ）

<br>

段落を配置し、改行しよう

<span>

文章の一部の色を変えよう

<ul>

<li>

リストを作ってみよう

リンクをつけよう

<img>

画像を表示しよう

<div>

グループ化しよう

エディターにコメントを入れてみよう

まずはここから、HTMLを体験してみよう

「まずはここから！HTMLを体験してみよう」レッスンの総復習クイズです。

<img>要素で使われる属性は多く存在していますが、その中でも$(1)属性は必須となっており、この属性では埋め込みたい画像へのパスを設定します。
また、$(2)属性は必須ではありませんが、アクセシビリティのために非常に有用で、スクリーンリーダーがこの属性に示された説明を読み上げることで、画像が何を表しているかをユーザーに伝えることができます。

見出しを実装しよう（h2-h6タグ）

まずは必要なスキルを確認しましょう！