logo

Jak zawijać tekst w CSS?

CSS zawijanie tekstu Właściwość służy do dzielenia długich słów i zawijania ich do następnej linii. Ta właściwość służy do zapobiegania przepełnieniu, gdy nierozerwalny ciąg znaków jest zbyt długi, aby zmieścić się w polu zawierającym.

Ta właściwość definiuje przerwy w słowie, aby uniknąć przepełnienia, gdy słowo jest za długie i nie mieści się w kontenerze. Określa łamanie słów, gdy zawartość przekracza granicę kontenera.

Składnia

 word-wrap: normal | break-word | initial l inherit ; 

Wartości

normalna: Jest to wartość domyślna używana do dzielenia słów tylko w dozwolonych punktach przerwania.

słowo-przerwa: Służy do łamania słów nie do złamania.

wstępny: Służy do ustawienia wartości domyślnej właściwości.

dziedziczyć: Dziedziczy właściwość od elementu nadrzędnego.

Przykład

 .test { width: 200px; background-color: lightblue; border: 2px solid black; padding: 10px; font-size: 20px; } .test1 { width: 11em; background-color: lightblue; border: 2px solid black; padding: 10px; word-wrap: break-word; font-size: 20px; } <p> In this paragraph, there is a very long word: iamsooooooooooooooooooooooooooooooolongggggggggggggggg. The long word will break and wrap to the next line. </p> 
Przetestuj teraz

Wyjście

Jak zawijać tekst w CSS