Цртице - ЦСС-трикови

Anonim

У hyphensконтроле имовину хипхенатион текста у елемената блок нивоу. Можете да спречите да се цртица уопште догоди, дозволите или дозволите само када су присутни одређени ликови.

Имајте на уму да hyphensје осетљив на језик. Његова способност да пронађе могућности прекида зависи од језика дефинисаног у langатрибуту надређеног елемента. Још нису подржани сви језици, а подршка зависи од одређеног прегледача.

Синтакса

p ( hyphens: none | manual | auto )

цртице: нема

Речи се никада не преносе на преломе ретка, чак и ако знакови унутар речи сугеришу где би цртица могла или требала да иде.

цртице: приручник

Речи се ломе само у преломима редова где се у речи налазе знакови који сугеришу могућности прелома ретка. Два су знака која сугеришу могућност прелома ретка:

  • U+2010(ВЕЗА): знак „тврда“ цртица указује на видљиву могућност прелома линије. Чак и ако линија у том тренутку заправо није прекинута, цртица се и даље приказује. Дословно „-“.
  • U+00AD(СТРАХ): невидљива, „мека“ цртица. Овај лик се не приказује видљиво; уместо тога, предлаже место где би прегледач могао да одлучи да разбије реч ако је потребно. У ХТМЛ-у можете -да уметнете меку цртицу.

цртице: ауто

Речи се могу ломити на одговарајућим тачкама за дељење речи или како их одређују знакови за дељење речи (погледајте горе) унутар речи или како их аутоматски одређује ресурс за дељење речи који одговара језику (ако их прегледач подржава или пружа путем @hyphenation-resource).

Условни знакови за депоновање речи, ако су присутни, имају предност над аутоматским ресурсима приликом одређивања тачака преноса у речи.

цртице: сви

Застарело, не користите . Ово је било само у спецификацији привремено за тестирање.

Демо

Демонстрација у наставку садржи гомилу пасуса и све је постављено hyphens: auto;да демонстрира концепт цртице. langАтрибут је подешен на enна родитељског елемента.

Погледајте ову оловку!

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

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

Десктоп

Хром Фирефок ИЕ Ивица Сафари
88 6 * 10 * 12 * 5.1 *

Мобиле / Таблет

Андроид Цхроме Андроид Фирефок Андроид иОС Сафари
88 85 81 4,2-4,3 *

Сафари 5+ захтева -webkit-, Фирефок 6+ захтева -moz-, ИЕ 10+ захтева -ms-, иОС 4.2+ захтева -webkit-.

Цхроме <55 и Андроид прегледач заправо подржавају -webkit-hyphens: none, што је подразумевана вредност, али ниједна од осталих вредности.

У Фирефоку и Интернет Екплореру аутоматско растављање цртица функционише само за неке језике (дефинисано langатрибутом). Погледајте ову напомену за свеобухватну листу подржаних језика.

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

Без ЈаваСцрипт-а мораћете да се ослоните на обе hyphensи word-wrap:

.hyphenate ( word-wrap: break-word; overflow-wrap: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; )