【HTML】知っておくと意外と便利なタグ

こんにちは!CodeClub965で講師をしているKです!

今回は、知っておくと意外と使える便利なタグを紹介します!

知らなくても困ることはありませんが、頭の片隅に置いとけば使える日がくるかもしれません。笑

rubyタグ

rubyタグはふりがなをふることができるタグです。

<body>
    <ruby>
       <rb>亜米利加</rb>
       <rt>アメリカ</rt>
    </ruby>
</body>

ブラウザでの表示結果

亜米利加 アメリカ


「rtタグ」でふりがなを囲みます。
「rbタグ」は、ふりがなをふる対象を明示的にするために使います。
ちなみに「rt」はルビーテキスト(Ruby Text)、「rb」 はルビーボディ(Ruby Body)を意味しています。

ただし、ブラウザによってはrubyタグに対応していないものもあるので、その場合は「rp」タグで囲みましょう。

<body>
    <ruby>
      亜米利加
      <rp>(アメリカ)</rp>
    </ruby>
</body>

strongタグ

strongタグはテキストを強調したいときに使用します。

<body>
    <p>この文字は強調しません!<strong>この文字は強調します!</strong></p>
</body>

ブラウザでの表示結果

この文字は強調しません!この文字は強調します!

iタグ

iタグは、テキストを斜め文字(イタリック体)にします。
そうすることで通常のテキストと区別したい場合に使用します。

<body>
    <p>この文字は普通の文字です。<i>この文字はイタリック体です。</i></p>
</body>

ブラウザでの表示結果

この文字は普通の文字です。この文字はイタリック体です。

最後に

今回は、知っておくと便利なタグを3つ紹介しました。

結構使えますので、ぜひ使ってみてください。

他にも便利なタグがあればまた紹介したいと思います!

それでは、また!