dorayakiBlog
~絵や興味ある事について書いてます~
header image

化学式の元素記号の小さい下付きの数字を特殊文字のhtmlで表す方法

サイト内で扱う絵具の顔料の金属元素の化学式を書こうと思い元素名の下に付いている小文字の数字はどの様に入寮すれば良いのかと思い文字入力の変換候補を見てみたが無かった(調べたり無いだけかもしれないが)。

なのでhtmlで特殊な文字を表す特殊文字での書き方を調べてみた。

そうすると&supに1〜3までの数字と;で上付きの小文字の数字を表す事は出来たが下付き文字は調べても見つからない。調べ足りないだけかもしれないが。後で書くhtmlタグの様な感じで&subで下付き文字に出来るかと考えたが特殊文字にはならず調べても無かった。

&supの例)
AL³

他に特殊文字でなくhtmlのタグで上付き文字や下付き文字を表す事の出来るタグで<sup></sup>や<sub></sub>があった。 <sup></sup>で上付き文字、<sub></sub>で下付き文字が表す事が出来た。ただ小文字にはならなかったのでcssのfont-sizeを50%ほどに設定したら元素記号のそれらしくなった。

<sub></sub>の例)
AL4
cssで調整した例)
AL4

がしかし今ひとつしっくりこないのでさらに調べてみたら、

特殊文字の文字参照の&#xに2080;で下付き文字の0を表す事が出来る様である。(Wikipediaより)

以下、
2081; で1
2082; で2
2083; で3
2084; で4
2085; で5
2086; で6
2087; で7
2088; で8
2089; で9

文字参照の&#xに数字の例)
AL₄

と最後の数字を下付きにしたい数字にする事で化学式元素記号の下付き文字を表す事出来た。