Tag-Tag HTML untuk Penulisan Hal Teknis

Halo gan. Di postingan sebelumnya, kita sudah membahas cara mengubah arah teks di HTML.

Kita review sedikit. Mengubah arah teks dapat dilakukan dengan menggunakan tag <bdo> ditambah dengan atribut dir. Ada 2 nilai dari atribut dir ini, yakni ltr (left to right) dan rtl (right to left).

ltr akan membuat teks ditampilkan dari kiri ke kanan sedangkan rtl membuat teks ditampilkan dari kanan ke kiri.

Kali ini, kita akan bahas beberapa tag HTML yang digunakan untuk penulisan hal teknis. Tag-tag tersebut yakni tag <samp>, tag <kbd>, dan tag <var>.

Tag <samp> untuk membuat Program Sample

Tag <samp> merupakan singkatan dari Program Sample. Tag ini digunakan untuk menuliskan kode program.

Tag <samp> akan ditampilkan dengan jenis font Monospace dan akan menghilangkan spasi yang lebih dari 1. Sama halnya dengan tag <code>.

Tag <samp> termasuk ke dalam jenis tag inline element.

Berikut contoh kode HTML-nya.

<!DOCTYPE html>
<html>
  <head>
    <title>Belajar HTML bareng AneIqbal</title>
  </head>
  <body>
    <p>HTML adalah singkatan dari <samp>Hypertext Markup Language</samp></p>
  </body>
</html>

Seperti ini jadinya.

Tag <kbd> untuk penulisan keyboard dan tag <var> untuk variabel

Tag <kbd> merupakan singkatan dari keyboard. Tag ini digunakan untuk menandai teks yang merupakan teks pada keyboard. Teks yang diapit oleh tag ini akan ditampilkan dengan jenis font Monospace.

Tag <var> merupakan singkatan dari variabel. Tag ini digunakan untuk menandai teks yang merupakan variabel matematika atau variabel program. Teks yang diapit oleh tag ini akan ditampilkan dengan huruf miring.

Barangkali Anda tertarik baca:

- Tutorial Formating Text HTML: Cara Memasukkan dan Menampilkan Karakter Khusus di HTML

- Tutorial Formating Text HTML: Tag abbr, cite, dfn, dan small untuk Struktur Text HTML

- Tutorial Formating Text HTML: Tag-Tag yang Berstatus Deprecated

Berikut contoh kode HTML tag <kbd> dan tag <var>.

<!DOCTYPE html>
<html>
  <head>
    <title>Belajar HTML bareng AneIqbal</title>
  </head>
  <body>
   <p>Tekan tombol <kbd>CTRL + SHIFT + ESC</kbd> untuk membuka Task Manager.
   <p>Variabel <var>x</var> akan bertype data string</p>
  </body>
</html>

Seperti ini jadinya.