From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/html/element/sup/index.html | 148 +++++++++++++++++++++++++++++++ 1 file changed, 148 insertions(+) create mode 100644 files/ja/web/html/element/sup/index.html (limited to 'files/ja/web/html/element/sup/index.html') diff --git a/files/ja/web/html/element/sup/index.html b/files/ja/web/html/element/sup/index.html new file mode 100644 index 0000000000..e1d70562d5 --- /dev/null +++ b/files/ja/web/html/element/sup/index.html @@ -0,0 +1,148 @@ +--- +title: ': 上付き文字要素' +slug: Web/HTML/Element/sup +tags: + - Element + - HTML + - HTML text-level semantics + - 'HTML:Flow content' + - 'HTML:Palpable Content' + - 'HTML:Phrasing content' + - Reference + - Web +translation_of: Web/HTML/Element/sup +--- +
{{HTMLRef}}
+ +

HTML の 上付き文字要素 (<sup>) は、表記上の理由で上付き文字として表示するべき行内文字列を指定します。上付き文字は普通、小さめのテキストを使用して高いベースラインで表示されます。

+ +
{{EmbedInteractiveExample("pages/tabbed/sup.html", "tabbed-shorter")}}
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
コンテンツカテゴリフローコンテンツ, 記述コンテンツ, 知覚可能コンテンツ
許可されている内容記述コンテンツ
タグの省略{{no_tag_omission}}
許可されている親要素記述コンテンツを受け入れるすべての要素
暗黙の ARIA ロール対応するロールなし
許可されている ARIA ロールすべて
DOM インターフェイス{{domxref("HTMLElement")}}
+ +

属性

+ +

この要素にはグローバル属性のみがあります。

+ +

使用上のメモ

+ +

<sup> 要素は、単純に表現や表示の結果を得るためではなく、表記規則上の理由、つまり、表記上の習慣や規則でテキストの位置を変更する必要がある場合にのみ使用してください。

+ +

例えば、高いベースラインを使用しているビジネスや製品の{{interwiki("wikipedia", "ワードマーク")}}をスタイル付けするには、 <sup> ではなく CSS を使用してください (例えば {{cssxref("vertical-align")}})。例えば、 vertical-align: super とするか、ベースラインを50%上げるのであれば、 vertical-align: 50% とするかしてください。

+ +

<sup> の適切な使用例には次のようなものがあります (但し、制約するものではありません)。

+ + + +

+ +

べき乗

+ +

以下のようにべき乗は、上付き文字のもっとも一般的な使い方です。

+ +
<p>物理学の中でもっとも有名な等式の一つが、
+<var>E</var>=<var>m</var><var>c</var><sup>2</sup>.<p>
+ +

結果の出力は次のようになります。

+ +

{{EmbedLiveSample("Exponents", 650, 80)}}

+ +

Superior lettering

+ +

Superior lettering は、厳密には上付き文字と同じではありません。しかし、 HTML で superior lettering を表現することは <sup> の一般的な利用方法です。最も多い superior lettering の使用例はフランス語の略語の表現です。

+ +
<p>Robert a présenté son rapport à M<sup>lle</sup> Bernard.</p>
+ +

結果の出力は次の通りです。

+ +

{{EmbedLiveSample("Superior_lettering", 650, 80)}}

+ +

序数

+ +

英語の "fourth" やスペイン語の "quinto" などの序数は、数字と上付き文字で表示される言語に依存したテキストを使用して略されることがあります。

+ +
<p>The ordinal number "fifth" can be abbreviated in various
+languages as follows:</p>
+<ul>
+  <li>English: 5<sup>th</sup></li>
+  <li>French: 5<sup>ème</sup></li>
+</ul>
+ +

出力は以下の通りです。

+ +

{{EmbedLiveSample("Ordinal_numbers", 650, 160)}}

+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'text-level-semantics.html#the-sub-and-sup-elements', '<sub> and <sup>')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'textlevel-semantics.html#the-sub-and-sup-elements', '<sub> and <sup>;')}}{{Spec2('HTML5 W3C')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("html.elements.sup")}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf