HTML wbr tag | belajar <wbr> element

HTML Fadlullah Fadul December 3, 2018

Referensi Belajar HTML wbr tag. Tutorial dan panduan mengenai element <wbr>. Mencakup penjelasan yang disertai contoh kode penggunaan sebagai rujukan untuk materi belajar HTML elemen <wbr>.

Deskripsi
Penjelasan HTML wbr

HTML element <wbr> (Word Break Opportunity) digunakan untuk merepresentasikan posisi sebuah kata atau frase yang dapat dipecah (dipindahkan) ke baris baru (line break).

<wbr> element digunakan dengan maksud untuk memecah (memilah) kata pada posisi yang tepat yaitu dengan memindahkannya pada garis baru (ketika telah melampaui batas tepi) sesuai dengan apa yang diharapkan. Ini, biasanya digunakan pada sebuah kata dengan karakter yang panjang.

HTML <wbr> merupakan tag yang diperkenalkan pertama kali oleh Internet Explorer 5.5, kemudian menjadi spesifikasi HTML5.

Global Attributes
Atribut Secara Global (Keseluruhan)

<wbr> tag mencakup global attributes, yang artinya tag tersebut dapat disisipkan semua attributes yang termasuk dalam global attributes yang secara umum berlaku untuk semua HTML tags.

Silahkan, lihat referensi mengenai HTML Global Attribute

Event Attributes
Atribut event (Peristiwa)

<wbr> tag mencakup event attributes, yang artinya attribute tersebut dijalankan ketika ada interaksi dari user atau dalam suatu peristiwa (kejadian). Contoh: menjalankan script (JavaScript) ketika halaman web pada jendela browser hendak ditutup, dan lain sebagainya.

Silahkan, lihat referensi mengenai HTML Events Attribute

Example
Contoh HTML <wbr> element

HTML 
<p>
Meskipun Budi seorang anak pejabat, dia harus mem<wbr>pertanggung<wbr>jawabkan perbuatannya.
</p>

Pada contoh diatas, kata "mempertanggungjawabkan" akan terpecah menjadi mem, pertanggung, dan jawabkan.

Contoh diatas dapat dilihat hasilnya pada demo editor dibawah. Cobalah resize / ubah perkecil ukuran jendela browser Anda perlahan-lahan, kemudian lihat pecahan kata yang akan digulung dalam sebuah baris baru.

Contoh Lengkap

Contoh source code lengkap disertai dengan link "editor" untuk mencoba (try it) dan melihat hasil (preview) kode.

SOURCE
editor 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Demo HTML wbr tag by:apacara.com</title>
    <style></style>
  </head>
  <body>
    <p>
      Meskipun Budi seorang anak pejabat, dia harus mem<wbr>pertanggung<wbr>jawabkan perbuatannya.
    </p>
  </body>
</html>
SHARE
Previous Article