103 of 133 menu

Tag wbr

Tag wbr menunjukkan tempat di mana browser dapat melakukan pelungkaian baris jika diperlukan (jika teks tidak muat dalam lebar elemen). Pelungkaian seperti ini disebut pelungkaian lembut.

Tidak memerlukan tag penutup.

Ketika memindahkan kata melalui tag wbr, simbol pemindahan "-" tidak ditambahkan. Jika Anda membutuhkannya - gunakan simbol pelungkai lembut ­ (titik koma di akhir wajib, ini bukan salah ketik).

Pelungkai lembut ­ menunjukkan kepada browser tempat di mana ia dapat melakukan pelungkaian kata (jika diperlukan), dengan menempatkan simbol pemindahan "-".

Pelungkai lembut ­ tidak akan bekerja jika properti hyphens diatur ke nilai none (sedangkan pelungkaian wbr akan bekerja).

Contoh . Teks tanpa pelungkaian

Mari kita lihat contoh teks, di mana ada kata-kata panjang yang keluar dari batas blok. Mari atur lebar blok kecil sehingga kata panjang tidak muat di dalamnya:

<div id="elem"> this is supersupersuperlong text </div> #elem { width: 200px; border: 1px solid black; }

:

Contoh . Tag wbr

Di sini, mari tambahkan tag wbr di tempat-tempat di mana kami merekomendasikan browser untuk melakukan pelungkaian kata jika diperlukan (perhatikan bahwa browser akan melakukan pelungkaian tidak di semua tempat yang kami tentukan):

<div id="elem"> this is super<wbr>super<wbr>super<wbr>long text </div> #elem { width: 200px; border: 1px solid black; }

:

Contoh . Simbol &shy;

Mari coba ganti tag wbr dengan simbol &shy;. Di tempat pelungkaian akan ditampilkan tanda hubung:

<div id="elem"> this is super­super­super­long text </div> #elem { width: 200px; border: 1px solid black; }

:

Lihat juga

  • tag br,
    ,
    yang melakukan pelungkaian ke baris baru
  • properti hyphens,
    yang mengatur pelungkaian kata sesungguhnya
  • properti word-break dan overflow-wrap,
    yang memungkinkan untuk memindahkan huruf kata panjang
  • properti overflow,
    yang memotong bagian yang keluar dari batas blok
kauzchicsda