How to realize the effect of automatic line wrapping with CSS3
This article will explain in detail how to achieve automatic line wrapping in CSS3. The editor thinks it is very practical, so I share it for you as a reference. I hope you can get something after reading this article.
Word-break attribute
Automatic line wrapping property, using the word-break attribute, allows the browser to wrap the line anywhere.
It has three property values:
Normal: default line wrapping behavior in browsers
Break-all: line breaks are allowed within words
Keep-all: line wrapping can only be done at half-width spaces or hyphens
Example:
.p1 {
Width:200px
Border:1pxsolid#ccc
Word-break:normal
}
.p2 {
Width:200px
Border:1pxsolid#ccc
Word-break:keep-all
}
.p3 {width:200px
Border:1pxsolid#ccc
Word-break:break-all
}
PhpChinesewebsiteprovidesalargenumberoffree,original,high-definitionphpvideotutorials.
PhpChinesewebsiteprovidesalarge numberoffree,original,high-definitionphpvideotutorials.
PhpChinesewebsiteprovidesalargenumberoffree,original,high-definitionphpvideotutorials.
This is the end of the article on "how to achieve automatic line wrapping in CSS3". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.
