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сипаты,
блок шекарасынан тыс шығып тұрған бөліктерді кеседі
