html - Div 溢出而不是单独的行

Question

可能重复：
wordwrap 一个很长的字符串

我的代码

<div style="width:40px;">adfdddddddddddddddddddd</div>

此代码应为 4 行，但它在一行中显示输出。

Answer 1

尝试

<div style="width:40px;word-wrap:break-word;">adfdddddddddddddddddddd</div>;

Answer 2

对于自动换行，请考虑添加此类。

.wordwrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}

请参阅此处的参考有没有办法在 div 中自动换行长单词？

Answer 3

您的代码在一行中显示输出，因为它将内容作为一个单词。一个单词将显示在一行中。使用一些句子尝试此代码，然后您将获得所需的输出。您可以尝试以下方法

<div style="width:40px;">This is a sentence.</div>