Home » Coding » Tutorial HTML » Cara Membuat Subscript dan Superscript HTML

Cara Membuat Subscript dan Superscript HTML

Di postingan sebelumnya, kita sudah membahas cara membuat tulisan tercoret di HTML. Kali ini kita bahas cara membuat superscript HTML. Supscript juga kita juga akan bahas. Jadi pastikan Anda simak panduan AneIqbal berikut sampai akhir.

Apa itu huruf superscript dan subscript? Pernah dengar atau lihat?

Membuat huruf superscript dengan tag <sup>

Tag <sup> merupakan singkatan dari superscript, yakni sebutan untuk teks kecil yang berada di atas kanan teks. Superscript ini contohnya perpangkatan pada matematika, 34, 53, dan yang lainnya.

Yang mana yang merupakan teks superscript? Angka 4 dan 3 itulah yang disebut teks superscript. Cara penulisan tagnya seperti ini: 3<sup>4</sup>, 5<sup>3</sup>.

Tag <sup> masuk ke dalam jenis tag inline element.

Berikut contoh kode HTML-nya.

<!DOCTYPE html>
<html>
  <head>
     <title>Membuat huruf superscript di HTML</title>
  </head>
  <body>
    <p>Hasil dari 3<sup>4</sup> adalah sama dengan 81.</p>
  </body>
</html>

Hasilnya seperti ini.

html superscript
Tampilan superscript HTML untuk pangkat

Membuat huruf subscript dengan tag <sub>

Tag <sub> merupakan singkatan dari subscript, yakni penyebutan untuk teks kecil yang berada di kanan bawah teks.

Tag <sub> ini biasanya digunakan untuk penulisan rumus kimia suatu zat, seperti H20. Cara penulisannya ,yakni H<sub>2</sub>O.

Tag <sub> juga termasuk dalam jenis tag inline element.

Seperti ini contoh kode HTML-nya.

<!DOCTYPE html>
<html>
  <head>
    <title>Membuat huruf subscript di HTML</title>
  </head>
  <body>
    <p>Rumus kimia air adalah H<sub>2</sub>O.</p>
  </body>
</html>

Seperti ini jadinya.

subscript html
Tampilan subscript pada rumus kimia

Kedua tag tersebut, tag <sub> dan tag <sup> kemungkinan akan jarang digunakan, kecuali jika memang ingin membuat web yang ada sangkut pautnya dengan matematika dan kimia.

Seperti itulah cara membuat huruf subscript dan superscript HTML. Selanjutnya, kita akan bahas cara membuat kutipan blockquote HTML.

Share yuk, ke:

Leave a Comment