Sifat word-break
Sifat word-break membolehkan
huruf perkataan panjang dibawa ke baris baru, jika
perkataan itu tidak muat dalam lebar bekas.
Sintaks
pemilih {
word-break: break-all | keep-all | normal;
}
Nilai
| Nilai | Keterangan |
|---|---|
break-all |
Memaksa perkataan panjang dibawa ke baris baru, jika perkataan itu tidak muat dalam bekas. |
keep-all |
Untuk membawa aksara Cina/Jepun (ideogram). |
normal |
Tingkah laku piawai: jika perkataan panjang tidak muat dalam lebar bekas - ia akan melepasi sempadannya (sambil bermula dari baris baru). |
Nilai lalai: normal.
Contoh . Nilai normal
Dalam contoh ini, perkataan yang sangat panjang tidak akan muat dalam bekas dan akan melepasi sempadannya (sambil bermula dari baris baru):
<div id="elem">
Lorem ipsum dolor sit amet
loooooooooooooooooooooooooooooooongword,
consectetur adipiscing elit.
</div>
#elem {
width: 200px;
word-break: normal;
border: 1px solid red;
}
:
Contoh . Nilai break-all
Sekarang, huruf-huruf yang tidak muat itu akan dibawa ke baris seterusnya:
<div id="elem">
Lorem ipsum dolor sit amet
loooooooooooooooooooooooooooooooongword,
consectetur adipiscing elit.
</div>
#elem {
width: 200px;
word-break: break-all;
border: 1px solid red;
}
:
Lihat juga
-
sifat
overflow-wrap,
yang juga membolehkan huruf perkataan panjang dibawa ke baris baru -
sifat
hyphens,
yang menghidupkan pemotongan perkataan mengikut suku kata -
sifat
overflow,
yang memotong bahagian yang melepasi sempadan blok -
tag
wbr,
yang melaksanakan pemotongan lembut menggunakan HTML -
tag
br,
yang boleh digunakan untuk memaksa teks dibawa ke baris baru