CSS word-wrap属性用于将长单词打断并自动换行到下一行。当不可破坏的字符串太长而无法容纳在容纳盒中时,此属性用于防止溢出。
CSS文字换行值
值 | 描述 |
---|---|
normal | 此属性仅用于在允许的断点处断开单词。 |
break-word | 它用于打断牢不可破的单词。 |
initial | 它用于将此属性设置为其默认值。 |
inherit | 它从其父元素继承此属性。 |
CSS 自动换行在线示例
<!DOCTYPE html> <html> <head> <style> p.test { width: 11em; background-color: #ff9900; border: 1px solid #ffffff; padding:10px; word-wrap: break-word; } </style> </head> <p class="test"> In this paragraph, there is a very long word: iamsooooooooooooooooooooooooooooooolongggggggggggggggg.The long word will break and wrap to the next line.</p> </html>测试看看‹/›
输出:
在这一段中,有一个很长的单词:iamsooooooooooooooooooooooooooooooooooooolongggggggggggggggg.long这个单词会折断并绕到下一行。