sup

sup 要素 (HTML)

[1] 多くの用字系 (たとえばフランス語) では、 適当なレンダリングのために上付き文字、 下付き文字が必要です。そのような場合の上付き文字のマーク付けのために sup を使います。 HTML 4

[10] CSS では、 vertical-align 特性の値を super (sup ではないことに注意。) とすると上付きレンダリングされます。

目次

  1. 仕様書
  2. 意味
  3. 分類
  4. 文脈
  5. タグ
  6. 内容属性
  7. 内容
  8. DOM インターフェイス
  9. レンダリング
  10. 関連
  11. 歴史
    1. HTML3
    2. HTML4
    3. HTML もどき
  12. メモ

仕様書#

意味#

[40] 上付き (superscript) 表します >>33

[38] 要素名sup は、 superscript (上付き) に由来します。

[9] sup 要素型が適当なのは、 言語的その他の理由で文章が成立するために上付きである必要がある時だけです。 単に装飾のためだけの理由で上付きにしたい場合は、 スタイル・シートを使うべきです。

[42] 特定の意味を持った印刷上の慣習 (typographical conventions) でのみ使わなければならず、 見た目を整えるためだけに使ってはなりません。 一般に、要素が無かったとしたら意味が変わってしまうような場合のみ、 使うべきです。 >>33

[43] 言語によっては略語で使います。 >>33

<span lang="fr"><abbr>M<sup>lle</sup></abbr> Gwendoline</span>

[47] 英語first は 1st と表記することもあります。 HTML では 1<sup>st</sup> となります。

[56] 数式に使うことができます。 >>33

<var>E</var>=<var>m</var><var>c</var><sup>2</sup>

MathML を使うべき (encourage) ですが、 それほどのものでもなければ sup を使えます。 >>33

[55] LaTeXロゴの表現に使うのは不適切です。 >>33

[46] ... と仕様書にはありますが、固有名詞の表記 (やロゴ) の場合、 それが装飾的なものなのか、意味に関わる本質的なものなのかの区別が困難ですし、 無理に区別する意味も薄いように思われます。

分類#

[34] フロー内容語句内容触知可能内容です >>33

文脈#

[35] 語句内容を使える場所に置くことができます >>33

タグ#

[2] 開始タグ終了タグとも必須です >>33

内容属性#

[39]

内容#

[36] 語句内容内容とすることができます >>33

DOM インターフェイス#

[41] 要素インターフェイスは、 HTMLElement です。 >>33

レンダリング#

[11] 視覚UA では、普通 vertical-align: superレンダリングします。 文字の大きさが周りよりも小さ目になることもあります。

[15] 上付きにすると文字の位置がの本来の高さとずれるために、 利用者エージェントによってはそのだけ違った高さになってしまうことがあります。

[12] テキスト・ブラウザでは上付きレンダリングできないのが普通ですが、 例えば w3m は直前に ^ を挿入して上付きであることがわかるようにします。

[13] >>12 の方法だけでは、 sup が入れ子になっている場合や sup 内の字数が多い場合などに利用者の混乱を招くかもしれませんから、 適宜を変えるなどの他の方法も使う方が好ましいでしょう。

[14]視覚系の利用者エージェントでは、 supレンダリングに工夫が必要です。 音声UA では言語と前後の文脈情報を利用して <span xml:lang="en">1<sup>st</sup></span>first と読み上げることもできるでしょうが、 一般の場合を考えると、 >>12 のように直前に少し間を置いて 上付き などと補うなどとなるでしょう。

#

[3] E = mc<sup>2</sup>

HTML 4 仕様書に載っていた例です。これがフランス語だとは思えませんが:)

(数学用字系, 化学用字系なんてのを考えれば、まあ、許容範囲でしょうか。 sub 要素型の本来想定されていた適用対象の1つでもありますし。)

[4] <SPAN lang="fr">M<sup>lle</sup> Dupont</SPAN>

こちらは正真正銘、仏蘭西語。これも HTML 4 仕様書からです。

[5] 他には、たとえば英語の 21st century21<sup>st</sup> century とするのも適当でしょう。

[6] 仏蘭西語の例:

<h2>7. Pour une sant&#233; meilleure au 21<sup>e</sup> si&#232;cle</h2>

[7] sup がよく使われるのは >>3 のような数学的な場面と >>4-5 のように省略形などの言語的慣習による場面 (他に、 <sup>TM</sup><sup>&reg;</sup> などが見られます。) のようです。

[18] 仏蘭西語の場合、省略形の後の部分が母音字だけを含むときは、必ず上付きにします。その他の場合は、上付きでも通常通りでも構いません。

必ず上付きにする例

<abbr xml:lang="fr" title="compagnie" lang="fr">C<sup>ie</sup></abbr>

必ず上付きにする例

<abbr xml:lang="fr" title="num&#233;ro" lang="fr">n<sup>o</sup></abbr>

上付きでも通常通りでも良い例

<abbr xml:lang="fr">Mlle</abbr>

<abbr xml:lang="en">M<sup>lle</sup></abbr>

(名無しさん [sage])

[19] 和蘭語の場合、

<span xml:lang="nl" lang="nl">2<sup>de</sup></span>

のように上付きにされることがよくあるものの、本来は

<span xml:lang="nl" lang="nl">2de</span>

のように通常通りにするべきだとされているものもあります。

(名無しさん [sage])

[21] クライアントサイド イメージマップ - Weblog (2007-08-14 21:00:00 +09:00 版) http://ryus.s21.xrea.com/w/item/942

おかしい<sup>※</sup>けれど、
<ul class="notes">
 <li><sup>※</sup> HTML 4.01 と XHTML 1.1 では、

(名無しさん)

[22] 脚注に用いた例

<b>二人零和確定完全情報ゲーム</b>である<sup id="cite_ref-0" class="reference"><a href="#cite_note-0" title="">[1]</a></sup>。
<ol class="references">
<li id="cite_note-0"><b><a href="#cite_ref-0" title="">^</a></b>

(名無しさん)

[23] 123期 新入生アンケート (2008-08-20 14:54:46 +09:00 版) http://www.tomikou.net/tokshuu/enq/123/index.html#q8

文武両道&loz;<sup>&loz;</sup>

文武両道&#9674;&#9674;

(名無しさん)

[24] クレジットカード - シティ VISAカード ・ マスターカード CITI CARDS JAPAN ( 版) http://www.citibank.co.jp/ccsi/notice/amazon_service/popup.html

<td width="100%" valign="top"><font size="2" class="sml">ご入会いただいた際の特典としてご案内させていただきました2,000円キャッシュバック特典の適用は2008年12月15日をもって終了させていただきます。まだカード発行から1年が経過していらっしゃらないお客様はお早めにご利用ください。<br>
なお、2,000円キャッシュバックはカード発行から1年以内に、Amazon.co.jp<img src="../../imgs/r.gif" alt="" width="7" height="7" hspace="1" vspace="2" border="0">が販売する商品を購入された場合が対象となります。Amazonマーケットプレイス</font><font class="cap" size="1"><sup>TM</sup></font><font size="2" class="sml">でのご利用は対象外となりますのでご注意ください。</font></td>

r.gif は「&#174;」。

[26]

フォローが殺到した理由には「平沢唯の元ネタ」として面白がられている側面もあるだろう<sup>※2</sup>

[27]

$44<sup>.99</sup>

関連#

[16] 上付きsup に対して、 下付きsub があります。

[17] 装飾のための似た CSS の指定として vertical-align 特性の値 super があります。

歴史#

HTML3#

[74] NN2sub, sup に対応しました。 HTML 3.0 機能としていて、 ウェブサイトでは HTML 3.0 仕様書から引用して紹介していました。 (実装していないはずの math 要素への言及までコピペしてました。)

[75] タイミング的には HTML 2.1 への追加とほぼ同時期で微妙ですが、おそらく HTML 2.1 由来でなく HTML 3.0 由来でしょうね。

[20] Classic Mozillasup終了タグだけがあるとそれ以降の文字が下付きになりました。 (大きさはそのまま。)

[73] HTML要素概説
要素名
sub
要素名
sup
日付
説明
HTML 2.1 に、 sub, sup が追加された。 現行仕様である。
出典

HTML4#

[37] 内容%inline; を使えるとされていました。

HTML もどき#

[71] DTBook にもあります。

メモ#

[25] 都道府県の人口一覧 - Wikipedia ( 版) http://ja.wikipedia.org/wiki/%E9%83%BD%E9%81%93%E5%BA%9C%E7%9C%8C%E3%81%AE%E4%BA%BA%E5%8F%A3%E4%B8%80%E8%A6%A7

[28] ncsa-mosaic/CHANGES at master · alandipert/ncsa-mosaic ( ( 版)) https://github.com/alandipert/ncsa-mosaic/blob/master/CHANGES#L57

[29] Welcome to Netscape Navigator Version 2.0 ( ( 版)) http://web.archive.org/web/20030202175634/http://wp.netscape.com/eng/mozilla/2.0/relnotes/windows-2.0.html#Images

[30] Google は検索結果の表示で sup を保持しているようです。

[31] 通信用語の基礎知識 ダウンロード (通信用語の基礎知識編纂委員会著, ) http://www.wdic.org/download.shtml

通信用語<sup>等</sup>の基礎知識

[32] 物件マニア賃貸売買版 [ 大阪 ] ( ()) http://www.b-mania.jp/

<strong class="tpn_layout">1R</strong>(<span class="tpn_size">35.64m&#178;</span>)</p>

[44] L10436 () http://www.planalto.gov.br/ccivil_03/leis/2002/L10436.htm

<p ALIGN="JUSTIFY" style="text-indent: 30px"><font face="Arial" size="2">Art. 2<u><sup>o</sup></u> Deve ser garantido, por parte do

[45] Aice5 - Wikipedia () https://ja.wikipedia.org/wiki/Aice5

Aice5(アイス)は、日本の声優ユニット。

[48] Aice5とは - はてなキーワード () https://d.hatena.ne.jp/keyword/Aice5

「上付き5=5」は、特殊文字として存在しない*2ため、

実際に表記する場合は、5とsupタグを指定しなければならない。*3

[49] Aice5(声優ユニット) - 声優データベース () http://lain.gr.jp/voicedb/unit/view/2

正式には「5」が上付き文字になる。

[50] Aice5 () http://king-cr.jp/artist/aice5/

「Aice<sup>5</sup> Final Party LAST Aice<sup>5</sup>レポート」

[51] Aice⁵ 結成10周年記念特設サイト () http://10th-anniversary.com/

[52] Aice⁵(@10th_anniv)さん | Twitter () https://twitter.com/10th_anniv

[53] 本日22時第2回放送!ニコニコ公式生放送「たかはし智秋のLADY LUCK CLUB」が好評です! | Akiba.TV () http://akiba.tv/2503/

※「Aice5」の「5」は、正しくは上付き文字(5乗)表記です。

[54] 発音表記用小書き漢字 - 世界の特殊文字ウィキ () http://seesaawiki.jp/w/qvarie/d/%c8%af%b2%bb%c9%bd%b5%ad%cd%d1%be%ae%bd%f1%a4%ad%b4%c1%bb%fa

[57] C3 -シーキューブ- - Wikipedia () https://ja.wikipedia.org/wiki/C3_-%E3%82%B7%E3%83%BC%E3%82%AD%E3%83%A5%E3%83%BC%E3%83%96-

C3 -シーキューブ-

[58] C3 シーキューブ公式(@C3_anime)さん | Twitter () https://twitter.com/C3_anime

[59] C3 -シーキューブ- () http://king-cr.jp/special/c3/

[60] バイエル符号

[61] YBO²リリース記念特番! Vol.1 生放送 - 2017/11/16 20:00開始 - ニコニコ生放送 () http://live.nicovideo.jp/watch/lv308518997?ref=qtimetable&zroute=index

[62] <sub> and <sup> in ATK / issue #121 (jasonkiss著, ) https://github.com/w3c/html-aam/commit/2b72311f6eb103df98f24c5a7137504f71edce1b

[63] The sub and sup elements should be mapped for ATK · Issue #121 · w3c/html-aam () https://github.com/w3c/html-aam/issues/121

[64] KOH+ - Wikipedia () https://ja.wikipedia.org/wiki/KOH%2B

[65] ラクスジェン・U6ターボ - Wikipedia () https://ja.wikipedia.org/wiki/%E3%83%A9%E3%82%AF%E3%82%B9%E3%82%B8%E3%82%A7%E3%83%B3%E3%83%BBU6%E3%82%BF%E3%83%BC%E3%83%9C

装備面では「アクティブイーグルビュー+」「サイドビュー+」「ナイトビジョン+」レーンキープシステム「LOWS+」を備えたマルチメディアシステム「THINK+Touch」を備え、iKEY+と呼ばれるスマートキーシステムや電子式パーキングブレーキ(=EPB、M+を含む)、本皮革シートなども用意。

[66] オープンアクセス - Wikipedia () https://ja.wikipedia.org/wiki/%E3%82%AA%E3%83%BC%E3%83%97%E3%83%B3%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B9

SCOAP3

[67] <sub> and <sup> in ATK / issue #121 (jasonkiss著, ) https://github.com/w3c/html-aam/commit/2b72311f6eb103df98f24c5a7137504f71edce1b

[68] The sub and sup elements should be mapped for ATK · Issue #121 · w3c/html-aam () https://github.com/w3c/html-aam/issues/121

[69] 昭憲皇太后 - Wikipedia () https://ja.wikipedia.org/wiki/%E6%98%AD%E6%86%B2%E7%9A%87%E5%A4%AA%E5%90%8E

中務少輔輔世

[70] 序数標識 - Wikipedia () https://ja.wikipedia.org/wiki/%E5%BA%8F%E6%95%B0%E6%A8%99%E8%AD%98