logo

Kaip apvynioti tekstą CSS?

CSS žodžių vyniojimas ypatybė naudojama ilgiems žodžiams pertraukti ir įvesti į kitą eilutę. Ši savybė naudojama siekiant išvengti perpildymo, kai nenutrūkstama eilutė yra per ilga, kad tilptų į dėžutę, kurioje yra.

Ši savybė apibrėžia žodžio pertraukas, kad būtų išvengta perpildymo, kai žodis per ilgas, kad tilptų į konteinerį. Jis nurodo žodžių laužymą, kai turinys viršija konteinerio ribą.

Sintaksė

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

Vertybės

normalus: Tai numatytoji reikšmė, kuri naudojama žodžiams pertraukti tik leidžiamuose lūžio taškuose.

lūžio žodis: Jis naudojamas nepertraukiamiems žodžiams nutraukti.

inicialas: Jis naudojamas norint nustatyti numatytąją nuosavybės vertę.

paveldėti: Jis paveldi nuosavybę iš pirminio elemento.

Pavyzdys

 .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> 
Išbandykite dabar

Išvestis

Kaip suvynioti tekstą į CSS