HTML のルビ注釈の代替方法

はじめに

この実験では、HTML の<rp>タグについて学びます。その使い方、構文、基本的な例について学びます。<rp>タグは、<ruby>タグをサポートしていない人用の代替括弧として使用されます。

注：index.htmlでコーディングを練習し、Visual Studio Code で HTML を書く方法を学ぶことができます。画面右下の「Go Live」をクリックして、ポート 8080 でウェブサービスを実行します。その後、Web 8080タブを更新して、ウェブページをプレビューできます。

HTML ファイルをセットアップする

1. index.htmlという名前の HTML ファイルを作成します。
2. 本文に以下の HTML コードを作成します。

<h1>HTML Ruby Parentheses</h1>
<p>Example text here.</p>

タグを追加する

1. <p> タグの下に <ruby> タグを追加します。
2. <ruby> タグの中に、開始タグと終了タグ付きの <rp> タグを追加します。

<ruby>
  <rp>(</rp>
  <rt>MTV</rt>
  <rp>)</rp>
</ruby>

グローバルイベントを追加する

1. インラインスタイルなど、コードに任意のイベントまたはグローバル属性を追加します。

<ruby style="font-size: 18px;">
  <rp>(</rp>
  <rt>MTV</rt>
  <rp>)</rp>
</ruby>

2. index.html ファイルをウェブブラウザで開いて、コードを表示します。

まとめ

この実験では、HTML の<rp>タグとその構文の使い方を学びました。また、<ruby>タグをサポートしていない人用の代替括弧を表示する基本的な例を作成する方法も学びました。<rp>タグは、さまざまな種類のブラウザで正しくフォーマットが表示されるようにするため、HTML において重要です。