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

This article mainly shows you "word-wrap how to automatically wrap", the content is easy to understand, clear, hope to help you solve your doubts, the following let the editor lead you to study and learn "word-wrap how to automatically wrap" this article.

Word-wrap introduction

Word-wrap sets whether to wrap the layout of text within an object when it encounters the top edge of the object.

1. Grammar

Word-wrap:normal-- allows content to top open the specified container boundary, encounter continuous no spaces in English or no space numbers without line wrapping (default, do not set objects also have default style)

The word-wrap:break-word-- content will wrap within the boundary, and when too much content reaches the boundary of the object, the content will automatically be forced to wrap.

2. Common situations

When there are too many consecutive numbers or letters in the object, the object container at the top of the content will not wrap, but the overflow will continue without wrapping. Unlike Chinese characters with spaces, Chinese characters freeze the boundaries of containers and automatically wrap lines.

3. Use grammar

P {word-wrap:break-word}

Sets the automatic line wrapping of the edges of the container of the text vertex object in the html paragraph p.

Code example:

Css forced line feeds

.bos {width:200px;height:80px;border:1pxsolid#F00;word-wrap:break-word;}

83480348023802ufjflsjfds843820483048jfdljfsl

Set the width of the class=bos object, the border, and put continuous text and numeric content inside. If you do not set word-wrap:break-word, you can observe in the browser that consecutive digital content does not wrap beyond the overflow box.

Here, the object is set to word-wrap:break-word to force line wrapping.

In the past, old IE browsers such as IE6 did not support it, but now most of them have Google browser. With the upgrade of computer systems, they all use higher IE browsers or other brand browsers, so most of them are compatible with this css automatic line wrapping attribute word-wrap style, so you can rest assured to use it.

The above is all the contents of the article "how to automatically wrap word-wrap lines". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

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.