Shulou(Shulou.com)06/02 Report--

This article mainly introduces "css how to achieve letter wrapping on less than one line". In daily operation, I believe many people have doubts about how css achieves letter wrapping on less than one line. The editor consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful for you to answer the question of "css how to achieve letter wrapping on less than one line". Next, please follow the editor to study!

The method of wrapping css letters on less than one line: 1, add "word-break:break-word;" style to the element to make it wrap in words; 2, add "word-break:break-all;" style to the element to make it wrap in alphabetical units.

The operating environment of this tutorial: windows7 system, CSS3&&HTML5 version, Dell G3 computer.

The method of wrapping css letters on less than one line

Open a html code page, create two div tags and enter an English statement. Set two css styles: automatic line wrapping by letter and automatic line wrapping by word.

Word-break:break-word;// means word wrapping, word-break:break-all;// means alphabetical line wrapping.

The code is as follows:

Document .aa {width:150px; word-break:break-word;} .bb {width:150px; word-break:break-all;} When summer comes, unlike most people, I will be very excited, because I like summer very much. People don't like summer because of its hot weather, which makes people sweat all the time. But summer is my favorite season, I can wear fewer clothes. I like to wear short jeans and a T-shirt, I feel so free. When summer comes, unlike most people, I will be very excited, because I like summer very much. People don't like summer because of its hot weather, which makes people sweat all the time. But summer is my favorite season, I can wear fewer clothes. I like to wear short jeans and a T-shirt, I feel so free.

Output result:

These are two different ways to break lines.

At this point, the study of "css how to wrap letters in less than one line" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.