Membuat teks subscript superscript di CSS
Membuat Teks Subscript Atau Superscript Di CSS

Di artikel Membuat Teks Subscript Atau Superscript Di HTML, Anda dapat memperlajari cara untuk membuat teks subscript atau superscript di HTML. Bila Anda membuat teks subscript atau superscript untuk artikel atau postingan online, selain dengan elemen HTML, Anda juga dapat membuatnya dengan CSS. Penggunaan elemen atau tag HTML jauh lebih praktis hanya jika teks subscript atau superscript tidak telampau banyak.

Jika Anda membuat teks subscript atau superscript untuk artikel online, Anda dapat menggunakan CSS. CSS lebih mudah bila nantinya Anda ingin mengubah atau memberi style tambahan teks subscript atau superscript. Untuk membuat teks subscript atau superscript dengan CSS, Anda dapat menggunakan property vertical-align dengan nilai sub atau super dan property font-size dengan nilai small atau medium.

Baca artikel:

Tergantung pada Anda, apakah style CSS untuk teks subscript atau superscript adalah sebagai inline CSS, inernal CSS atau External CSS. Di artikel kali ini, style CSS untuk membuat teks subscript atau superscript menggunakan internal CSS. Berikut ini adalah contoh skrip membuat teks subscript atau superscript dengan CSS:

<!DOCTYPE html>
<html>
<head>
   <style type="text/css">
      .subtext {vertical-align: sub; font-size: small;}
      .supertext {vertical-align: super; font-size: small;}
   </style>
</head>
<body>

<h2>Teks subscript dan Superscript dengan CSS.</h2>
<p>Cara membuat teks subscript dan superscript menggunakan property CSS vertical-align dan font-size.</p>

<h3>Membuat teks subscript.</h3>
<p>Rumus kimia air : H<span class="subtext">2</span>O</p>
<p>Rumus kimia karbon dioksida : CO<span class="subtext">2</span></p>

<h3>Membuat teks superscript.</h3>
<p>Rumus persamaan kuadrat : ax<span class="supertext">2</span> + bx + c = 0</p>
<p>Rumus energi Albert Einstein : E = mc<span class="supertext">2</span></p>

</body>
</html>

Contoh skrip di atas menggunakan elemen span (tag <span>) HTML. Umumnya, Elemen span HTML ini digunakan untuk tujuan styling dengan memanfaatkan CSS. Anda dapat membaca artikel terkait elemen span HTML di Memberi Style Pada Bagian Tertentu Teks Menggunakan Elemen span HTML. Berikut ini adalah hasil tampilan atau rendering di web browser Google Chrome:

Cara membuat teks subscript atau superscript dengan CSS

ARTIKEL TERKAIT

PRODUK TOKO GERZAL

Murah Taffware OKD180 power supply station 220V 69800mAh
Taffware OKD180 Power Supply Station Generator 220V 69800mAh
Rp 1.124.500
(4.8/5)
Murah Fosi Audio DA2120C Power Amplifier
Fosi Audio DA-2120C Bluetooth 5.0 Amplifier 2.1 Channel with Remote
Rp 2.310.900
(5/5)
Murah Fosi Audio BT30D Pro Power Amplifier
Fosi Audio BT30D PRO MAX Bluetooth 5.0 Amplifier 2.1 Channel 165x2+350W
Rp 1.381.600
(5/5)
Murah Taffware OKD320A Power Supply Station 84000mAh 300W
Taffware OKD320A Power Supply Station Generator Portable 84000mAh 300W
Rp 1.546.200
(4.9/5)