Di artikel Bagaimana Membuat Teks Subscript Atau Superscript Dengan HTML, dapat dipelajari cara membuat teks subscript atau superscript dengan HTML. Bila Anda ingin membuat teks subscript atau superscript untuk artikel atau postingan online, selain membuat dengan elemen HTML, Anda juga dapat membuatnya dengan CSS. Penggunaan elemen atau tag HTML lebih praktis bila teks subscript atau superscript yang dibuat tidak banyak.

Bila Anda harus membuat teks subscript atau superscript untuk artikel atau postinganonline, Anda dapat menggunakan CSS. CSS lebih mudah bila Anda ingin merubah teks subscript atau superscript yang ada atau ingin memberi style tambahan. Untuk membuat teks subscript atau superscript di CSS, Anda dapat menggunakan property vertical-align dengan nilai sub atau super dan property font-size dengan nilai small atau medium.

Baca artikel Memformat Teks Sebagai Superscript Atau Subscript Di Microsoft Word

Tergantung Anda, apakah style CSS untuk membuat teks subscript atau superscript adalah sebagai inline CSS, inernal CSS atau External CSS. Di artikel ini, style CSS untuk membuat teks subscript atau superscript menggunakan internal CSS. Anda dapat mempelajari cara menggunakan CSS dengan HTML di link artikel di bawah ini. Berikut ini adalah contoh membuat teks subscript atau superscript dengan CSS:

Baca artikel Tiga Cara Menggunakan CSS Dengan HTML

<!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 bantuan 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 Cara Memberi Style Pada Bagian Tertentu Teks Menggunakan Elemen span HTML. Berikut ini adalah hasil tampilan (rendering) di web browser Google Chrome:

Cara membuat teks subscript atau superscript dengan CSS

SUKAI DAN BAGIKAN ARTIKEL INI:
Pin It