Тег wbr

Тег wbr браузерга сатр перносини зарурат ҳолатида (агар матн элементнинг энига сиғмаса) қила оладиган жойни кўрсатади. Бундай перенослар йумшак деб аталади.

Ёпилувчи тегни талаб қилмайди.

wbr теги орқали сўзни перенос қилганда, перенос белгиси "-" қўшилмайди. Агар у сизга зарур бўлса - йумшак пернос белгиси  ни (нуқта-вергул ахирида мажбурий, бу хатолик эмас) ишлатинг.

Йумшак перенос  браузерга у перенос белгиси "-" ни қўйиб, сўзни перенос қила оладиган жойни (зарурат ҳолатида) кўрсатади.

Йумшак перенослар  ишламейди, агар hyphens xусусияти none қийматида берилган бўлса (ва wbr перенослари ишлайди).

Мисол . Перносиз матн

Келтирилган мисол матнга назар солайлик, унда блок чегарасидан ташқарига чиқиб қоладиган узун сўзлар мавжуд. Блокка кичкина эн берамиз, шунда узун сўз унга сиғмасин:

<div id="elem">
	this is supersupersuperlong text
</div>

#elem {
	width: 200px;
	border: 1px solid black;
}

Мисол . Тег wbr

Бу ерда эса, биз браузерга сўзни перенос қилишни тавсия қиладиган жойларга wbr тегини қўшамиз (эътибор беринг, браузер биз кўрсатган барча жойларда эмас, балки зарурат бўлган жойлардагина перенос қилади):

<div id="elem">
	this is super<wbr>super<wbr>super<wbr>long text
</div>

#elem {
	width: 200px;
	border: 1px solid black;
}

Мисол .  белгиси

wbr теги ўрнига  белгисини қўйиб кўрайлик. Перенос қилинадиган жойларда дефислар кўринади:

<div id="elem">
	this is supersupersuperlong text
</div>

#elem {
	width: 200px;
	border: 1px solid black;
}

Шунингдек қаранг

тег br,
,
у янги сатрга перенос қилади
хусусия hyphens,
у ҳақиқий сўз переносларини белгилайди
хусусиятлар word-break ва overflow-wrap,
улар узун сўз ҳарфларини перенос қилишга имкон беради
хусусия overflow,
у блок чегарасидан ташқарига чиқиб қолган қисмларни кесади

Тег wbr

Мисол . Перносиз матн

Мисол . Тег wbr

Мисол . &shy; белгиси

Шунингдек қаранг

Мисол . белгиси