Hyphens Property

Хосияти hyphens калимаҳоро дар браузер бо истифода аз аломати гузариш "-" фаъол мекунад. Барои дастгирии забони русӣ лозим аст атрибути lang="ru" ба теге, ки гузаришҳо ба он татбиқ карда мешаванд (ё ба волидайни ин тег) илова карда шавад. Метавонед танҳо ин атрибутро ба теги html илова кунед. Бе ин гузаришҳо кор нахоҳанд кард.

Синтаксис

cssселектор {
  hyphens: auto | manual | none;
}

Қиматҳо

Қимат	Тавсиф
`auto`	Аломатҳои гузаришро дар ҷойҳое, ки лозим аст, ҷойгир мекунад.
`manual`	Гузаришҳоро фақат дар он ҷойҳое илова мекунад, ки теги `wbr` ё аломати махсус `` илова карда шудааст ва фақат дар сурати зарурӣ. Чунин гузаришҳоро нарм меноманд.
`none`	Ҷойгиркунии гузаришҳоро бекор мекунад (калимаҳо гузарида намешаванд, ҳатто агар гузаришҳои нарм мавҷуд бошанд).

Қимати пешфарз: manual.

Қимати auto

html<p lang="en">
  Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
  aenean a dapibus magna, ac interdum nisl. Suspendisse egetil
  fringilla nibh, eu commodo arcu. Donec lacinia tempor velite
  sed tincidunt. Aliquam porttitor nulla purus, vel vulputater
  ipsum faucibus sed. Phasellus sodales, lorem vel cursus vehi
  ante purus lacini dui, interdum fringilla massa eros ut duir
  nullam et ipsum ex. Donec ut iaculis massa. Duis vel ulamcor
  per dolor. Suspendisse tristique dolor risus, nec laoreet du
  aliquet maximus. Maecenas tempus congue arcu, si amet auctor
  dui efficitur in. Proin ac auctor nisi. Phasellus luctus eur
  neque sollicitudin rutrum. Curabitur ipsum justo, sodales in
  lectus non, molestie ullamcorper elit, orciro varius natoque.
</p>

cssp {
  width: 400px;
  hyphens: auto;
  border: 1px solid red;
  text-align: justify;
}

Результат:

Ҳамчунин нигаред

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