sub 下付きテキストで化学式表記 コピペで使えるHTML+CSS

sub要素の概要

ポリアセタールの化学式は、CH<sub>3</sub>CO[OCH<sub>2</sub>CH<sub>2</sub>]<sub>n</sub>OCOCH<sub>3</sub>

属性

グローバル属性のみ

CSSデザイン

数字部分に黄色の背景をつける

background-colorで指定する。黄色は#ffff00

スタイルシートで記述

ポリアセタールの化学式は、<span class="yellow-sub">CH<sub>3</sub>CO[OCH<sub>2</sub>CH<sub>2</sub>]<sub>n</sub>OCOCH<sub>3</sub></span>

.yellow-sub sub{ /* yellow-subクラスを持つ要素の子のsub要素に適用するという意味 */
    background-color:#ffff00;
}