Тегот wbr
Тегот wbr означува место каде што прелистувачот
може да направи прелом на линијата доколку е потребно
(ако текстот не се вклопи во ширината на елементот).
Ваквите преломи се нарекуваат мек прелом.
Не бара затворачки тег.
При прелом на збор преку тегот wbr симболот
за цртичка "-" не се додава. Ако
ви е потребен - користете го симболот за мек
прелом ­ (точка и запирка
на крајот се задолжителни, ова не е печатна грешка).
Мекот прелом ­ му покажува
на прелистувачот местото каде што може да направи прелом
на зборот (доколку е потребно), ставајќи
при тоа симбол за цртичка "-".
Мектите преломи ­ нема
да работат, ако својството hyphens
е зададено со вредност 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,
кое ги отсекува деловите кои излегуваат надвор од границата на блокот
