Cara Membuat Tulisan Miring di HTML

Sebelumnya, kita sudah membahas perbedaan antara block element dan inline element. Sekarang kita bahas cara membuat tulisan miring di HTML. Berikut pembahasan selengkapnya jadi pastikan Anda membaca panduan AneIqbal ini sampai akhir.

Membuat huruf miring di HTML dapat dilakukan dengan 2 cara. Cara pertama menggunakan tag <i> dan cara kedua adalah menggunakan tag <em>.

Membuat huruf miring dengan tag <i>

Tag <i> merupakan singkatan dari italic. Italic tersebut adalah sebutan untuk teks yang ditulis miring. Awalnya, tag <i> tidak memiliki arti struktur apa-apa. Bahkan, pernah berstatus deprecated yang artinya tidak disarankan untuk digunakan lagi.

Kenapa bisa seperti itu? Karena, tag <i> ini hanya semata-mata membuat huruf menjadi miring atau italic.

Nah, karena tag-nya hanya bertujuan membuat efek tampilan semata-mata, sebagian programmer berpendapat bahwa sebaiknya tidak dipakai dan dialihkan ke CSS.

Di era HTML5 sekarang ini, tag <i> tetap dipertahankan. Hanya saja, penggunaannya berubah menjadi “alternative voice”.

Alternative voice ditujukan untuk menandai bagian teks yang pengucapan atau maknanya berbeda, seperti untuk menandai kata ilmiah atau yang berasal dari bahasa asing.

Tag <i> adalah salah satu tag berjenis inline element. Karena, tag <i> tidak membuat blok dan baris baru, dan mengikuti alur tag yang ada.

Kita coba buat teks yang miring dengan tag <i>.

<!DOCTYPE html>
<html>
  <head>
    <title>Membuat huruf miring di HTML dengan element i</title>
  </head>
  <body>
    <p>HTML merupakan singkatan dari <i>Hypertext Markup Language</i></p>
  </body>
</html>

Simpan lalu jalankan. Seperti ini jadinya.

tag untuk membuat huruf miring adalah
tag <i> untuk membuat tulisan miring

Membuat huruf miring dengan tag <em>

Tag <em> merupakan singkatan dari Stresses Emphasis. Stresses Emphasis berguna untuk menandai teks yang perlu diberi penekanan.

Saat tampil di web browser, tag <em> akan menampilkan huruf miring, sehingga mirip dengan tag <i>.

Sama seperti tag <i>, tag <em> juga termasuk dalam tag berjenis inline element, yang akan menyatu dengan tag yang ada di sekitarnya.

Kita coba kodingannya.

<!DOCTPYE html>
<html>
  <head>
    <title>Membuat huruf miring dengan tag <em></title>
  </head>
  <body>
    <p>Dalam belajar membuat web, yang pertama kali harus dipelajari adalah <em>HTML</em>
  </body>
</html>

Simpan lalu jalankan. Seperti ini jadinya:

membuat tulisan miring di html
tag <em> untuk membuat huruf miring

Meski sama tampilannya, menjadi miring hurufnya, keduanya punya maksud tujuan masing-masing. Tag <i> untuk kata atau istilah asing, sedangkan tag <em> digunakan untuk penekanan kata.

Tak masalah juga bila ingin menggunakan salah satu saja, atau keduanya, atau campuran untuk membuat huruf miring. Sebaiknya gunakan yang lebih familiar untuk kita.

Seperti itulah cara membuat tulisan miring di HTML. Huruf miring dapat kita buat dengan tag <i> dan tag <em>. Kedua tag itu akan menampilkan hasil yang sama walaupun sebenarnya punya maksud tujuan yang berbeda.

Selanjutnya, kita akan bahas cara membuat tulisan tebal di HTML.

Leave a Comment