Az overflow-wrap tulajdonság

A overflow-wrap tulajdonság lehetővé teszi egy hosszú szó betűinek új sorra vitelét, ha az a szó nem fér el a tároló szélességében.

Szintaxis

cssszelektor {
  overflow-wrap: break-word | normal;
}

Értékek

Alapértelmezett érték: normal.

Példa . Normal érték

Ebben a példában egy nagyon hosszú szó nem fog elférenni a tárolóban és kilóg annak határain (de új sorban kezdődik):

html<div id="elem">
  Lorem ipsum dolor sit amet
  loooooooooooooooooooooooooooooooongword,
  consectetur adipiscing elit.
</div>

css#elem {
  word-wrap: normal;
  overflow-wrap: normal;
  border: 1px solid red;
  width: 200px;
}

Результат:

Példa . Break-word érték

Most viszont azok a betűk, amelyek nem fértek el, egyszerűen átkerülnek a következő sorra (de a hosszú szó továbbra is új sorban kezdődik):

html<div id="elem">
  Lorem ipsum dolor sit amet
  loooooooooooooooooooooooooooooooongword,
  consectetur adipiscing elit.
</div>

css#elem {
  overflow-wrap: break-word;
  border: 1px solid red;
  width: 200px;
}

Результат:

Lásd még