HTMLの上付き文字と下付き文字のテキストとその使用時期

HTMLの^{タグは、上付き文字のテキストを指定します。これは、テキスト行の上部に表示されるテキストです。 _{タグは、添え字テキストを表します。これは、テキスト行の下部に表示されるテキストです。}}

ほとんどの場合、テキストに遭遇すると、従来のベースラインとエックスハイトがあります。

この記事のこの時点までのこのテキストのすべてにベースラインがあります。このベースラインは、基本的に、アンダースコアを1とxハイトでフォーマットした場合にアンダースコアが表示されるポイントです。エックスハイトは、小文字で終わる架空の線です。スペースを埋めるため、小文字のxから名前が付けられます。

このガイドでは、HTMLで下付き文字と上付き文字を定義する方法について説明します。これらのテキストフォーマットの各トピックの例を見ていき、コードでの使用方法を学習できるようにします。

上付き文字と下付き文字はいつ使用されますか？

設定したテキストの下または上に半文字の文字を使用したい場合があります。下付き文字は、テキストの下半分の文字に設定された文字です。上付き文字は、テキストの半分の文字上に設定された文字です。

実際の設定では、数学反応式、化学反応式、引用、脚注などを使用するときにこれらの文字を使用します。

HTMLスーパーテキスト

HTMLでスーパーテキストを作成するには、^{タグを使用します。このタグは、囲まれたテキストを行の先頭に表示します。 supタグにはタグ固有の属性はありません。}

このメソッドの構文を見てみましょう：

参加者の81％は、ブートキャンプに参加した後、自分たちの技術的な仕事の見通しについてより自信を持っていると述べました。今日のブートキャンプにマッチしましょう。

平均的なブートキャンプの卒業生は、ブートキャンプの開始から最初の仕事を見つけるまで、キャリアの移行に6か月も費やしませんでした。

<p>4 <sup>2</sup> = 16</p>

^{タグで「2」文字を囲みました。これにより、「2」が上付き文字で表示されます。コードは次のようになります：}

4²=16

HTMLサブテキスト

HTMLの_{コマンドはサブテキストを定義します。サブテキストとは、テキスト行の下部に表示されるテキストを指します。}

次の構文を検討してください：

<p>This is main text. <sub>3</sub></p>

コードは次のようになります：

これが本文です。 ₃

スーパーテキストの例のように、_{のタグ属性は指定していません。テキストをサブテキストに移動するには、そのテキストを_{タグで囲みます。}}

サブテキストは、元素の周期表の元素番号を説明するためによく使用されます。

HTMLサブテキストとスーパーテキストの例

HTMLWebページの_{と^{の両方の例を見ていきましょう。次のコードを検討してください：}}

<!DOCTYPE html>
<html lang="en">
<head>
<style>
 
</style>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Superscript and Subscript</title>
   <style>
       sub {
           vertical-align: sub;
           font-size: smaller;
       }
       sup {
           vertical-align: super;
           font: smaller;
       }
   </style>
</head>
<body>
   <div style="text-align:center;" class="container">
       <div>
           <h3>Superscript</h3>
           <span>E=MC<sup>2</sup></span>
           <br />
           <span>1.7 x 10<sup>4</sup></span>
       </div>
       <div>
           <h3>Subscript</h3>
           <span>H<sub>2</sub>O</span>
           <br />
           <span><sup>†1</sup>Ipsum, Lorem. Footnote example, 2020.</span>
       </div>
   </div>
</body>
</html>

ご覧のとおり、を使用していますおよびに効果を作成するための添え字タグと上付きタグ HTML要素。いくつかのデフォルト値が付属しています：

<style>
       sub {
           vertical-align: sub;
           font-size: smaller;
       }
       sup {
           vertical-align: super;
           font: smaller;
       }
</style>

どちらのタグも、HTMLで使用できるイベント属性とグローバル属性を使用します。基本的に、これは、誰かがテキストをクリックした場合にイベントハンドラーを設定できることを意味します。

さらに、通常のHTML属性のいずれかを使用して、要素をカスタマイズできます。利用可能な通常のHTML属性のリストは、W3Schoolsによって作成されたグローバル属性リストにあります。

結論

HTMLの_{要素は、テキストの段落にサブテキストを追加します。サブテキストは、テキスト行の下部に表示されます。 ^{は、テキスト行の上部に表示されるテキストにスーパーテキストを追加します。}}

それでおしまい！これで、HTMLで上付き文字と下付き文字を正常に作成できます。

HTMLについてもっと知りたいですか？トップオンラインコースや書籍に関する専門家のヒントやガイダンスについては、完全なHTMLの学習方法ガイドをご覧ください。

フォントHTMLの変更：ハウツーガイド

HTML画像：ステップバイステップガイド

Google ドキュメントで下付き文字と上付き文字を使用する方法
文書内の特定の単語では、テキスト行の上部 (上付き文字) または下部 (下付き文字) に小さい文字が必要になることがよくあります。これは、数学テキスト、化学式、または日付のような単純なもので特に一般的です。 Google ドキュメントでは、Google ドキュメントで下付き文字と上付き文字を実行する方法が 3 つあります。 1 つはメニューシステムを使用する方法、もう 1 つはキーボードショートカットを使用する方法、最後は特殊文字チャートを使用する方法です。また、この記事のすべてを説明している短い YouTube ビデオもぜひご覧ください。 Google ドキュメントで上付き文字
Android でコピーアンドペーストを使用する方法
全世界は常に、カット/コピーアンドペーストの Larry Tesler にお世話になっています。このシンプルでありながら本質的な機能は、コンピューティングのかけがえのない部分です。コピー＆ペーストのないデジタル世界は想像できません。同じメッセージを何度も入力するのはイライラするだけでなく、コピーアンドペーストせずに複数のデジタルコピーを作成することはほぼ不可能です。時が経つにつれて、携帯電話は私たちの日常のタイピングのほとんどが行われる標準的なデバイスとして登場しました。したがって、Android、iOS、またはその他のモバイル用オペレーティングシステムでコピーアンドペースト機