Прелом речи - ЦСС-трикови

word-breakИмовина у ЦСС се може користити за промену када лине паузе треба да се догоди. Прекиди редова у тексту обично се могу појавити само у одређеним размацима, на пример када постоји размак или цртица.

У доњем примеру word-breakуместо њих можемо направити слова:

p ( word-break: break-all; )

Ако тада поставимо ширину текста на једно em, реч ће се сломати за свако слово:

Текст оловке погледајте вертикално са преломом речи помоћу ЦСС-трикова (@ цсс-трикови) на ЦодеПен-у.

Ова вредност се често користи на местима са садржајем који генеришу корисници, тако да дуги низови не ризикују разбијање изгледа. Један врло чест пример је дуга копија и налепљена УРЛ адреса. Ако та УРЛ адреса нема цртице, може се проширити изван родитељског оквира и изгледати лоше или још горе, што може довести до проблема са изгледом.

Погледајте везе за учвршћивање оловке помоћу прелома речи помоћу ЦСС-трикова (@ цсс-трикови) на ЦодеПен-у.

Вредности

normal: користите подразумевана правила за разбијање речи.
break-all: било која реч / слово може се пребацити у следећи ред.
keep-all: за кинески, јапански и корејски текст речи нису ломљене. Иначе је ово исто као normal.

Ово својство се такође често користи заједно са својством цртица, тако да се у случају прекида убацује хипен, према стандарду у књигама.

Потпуна употреба, са потребним префиксима добављача, је:

 -ms-word-break: break-all; word-break: break-all; /* Non standard for WebKit */ word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto;

Коришћење ових својстава на универзалном бирачу може бити корисно ако имате веб локацију са пуно корисничког садржаја. Иако поштено упозорење, може изгледати чудно на насловима и унапред форматираном тексту (

Повезан

оверфлов-врап
цртице
бели простор
Руковање дугим речима и УРЛ-овима

Подршка прегледача

Подаци о подршци за прегледач су од компаније Цаниусе, која садржи више детаља. Број указује на то да прегледач подржава функцију у тој верзији и новијој.