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
SUKAI DAN BAGIKAN ARTIKEL INI:
Pin It