Tutorial Text HTML Part 9: Cara Untuk Merubah Arah Text dalam HTML (tag bdo)

Karena HTML digunakan tidak hanya untuk web dengan huruf alphabet, tetapi juga huruf yang berupa karakter-karakter khusus seperti huruf china atau huruf arab, maka HTML memiliki sebuah tag khusus yang digunakan untuk merubah arah text. Di dalam tutorial kali ini kita akan membahas Cara Untuk Merubah Arah Text dalam HTML dengan tag <bdo>.


Tag <bdo> untuk Merubah Arah Text HTML

Tag <bdo> adalah singkatan dari Bidirectional Override. Tag ini ditujukan untuk merubah arah text yang normalnya ditulis dari kiri ke kanan seperti bahasa inggris atau bahasa indonesia, menjadi dari kanan ke kiri seperti penulisan dalam bahasa arab.

Untuk menjalankan fungsinya, tag <bdo> memerlukan sebuah atribut dir yang bisa berisi salah satu dari 2 nilai, yakni ltr dan rtl.

Nilai Atribut ltr adalah singkatan dari left to right yang akan membuat arah text mulai dari arah kiri lalu ke arah kanan web browser. Sedangkan rtl adalah singkatan dari right to left yang akan menampilkan text dari kanan ke kiri.

Tag <bdo> termasuk kedalam tipe tag inline, dan akan ditampilkan mengikuti alur text yang ada.

Berikut adalah contoh cara penulisan dan penggunaan tag <bdo> di dalam HTML:

<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML di Duniailkom</title>
</head>

<body>
<h3>Saya sedang belajar HTML di Duniailkom.com</h3>
<p>
<bdo dir="ltr">HTML adalah dasar dari semua halaman web di internet. 
Jika anda ingin mempelajari cara membuat website,
maka hal pertama yang harus dipelajari adalah HTML</bdo></p>
 
<p>
<bdo dir="rtl">HTML adalah dasar dari semua halaman web di internet. 
Jika anda ingin mempelajari cara membuat website,
maka hal pertama yang harus dipelajari adalah HTML</bdo></p>
</body>

</html>

Contoh Cara Merubah Arah Text dalam HTML - tag bdoSeperti yang terlihat, penggunaan tag <bdo dir="rtl"> akan membuat web browser menampilkan karakter dari kanan ke kiri. Untuk text dengan bahasa indonesia atau bahasa inggris, tag ini akan jarang digunakan, kecuali anda ingin membuat pembaca pusing seperti contoh diatas.

6 Comments

  1. McKarlson
    16 Apr 17
  2. Anonymous
    23 Jun 17
  3. Suharto
    25 Jun 18
    • Andre
      25 Jun 18
  4. Anonymous
    07 Oct 21

Add Comment

Leave a Reply to Suharto Cancel reply