[分享]css3文本不换行

CSS3的文本不换行属性为wordwrap，可以让长单词或长字符串在到达末尾时，自动换行或延伸到当前行后面。使用它可以避免超出固定尺寸的容器而产生不必要的滚动条。 比如以下的样式规则： p { wor...

CSS3的文本不换行属性为word-wrap，可以让长单词或长字符串在到达末尾时，自动换行或延伸到当前行后面。使用它可以避免超出固定尺寸的容器而产生不必要的滚动条。
比如以下的样式规则：

p {
    word-wrap: break-word;
} 

当一个段落文字超出容器宽度时，CSS3就会自动将它分成两行。这个属性可以用于网站中的留言板、新闻摘要和产品介绍等地方，让排版更加美观。
此外，还有一个类似的属性 - word-break。它可以让单词在中间分行或者连接，根据你的需要选择即可。

p {
    word-break: break-all;
} 

当单词长度大于它的容器时，CSS就会把它们分割成不同的行。这个属性可以用于表格格子或表单的输入框，让长单词不会影响页面的美观度。
总之，CSS3的word-wrap和word-break属性可以让我们更好的控制文本的布局，并且在网站设计中能起到不可缺少的作用。