<p>当文字超出宽度时,继续换行

Question

我有以下结构:

<ul>
<li>
<p style="width:10px;">
Text goes here
</p>
</li>
<li>
<p style="width:10px;">
Text goes here
</p>
</li>
</ul>

当p的文本超过10px限制时,我希望它继续在新的行中.我该怎么做？谢谢

Answer 1

您的示例已经是自动换行(因为<p>已经是一个块元素),如果您想要破解单词,那么您可以尝试:

p.letters {
    word-wrap: break-word;
}

这是一个基本的工作示例:http://jsfiddle.net/G9z5M/(请参阅下面的更新).

你可以使用各种技术来玩它:

/* Wraps normally, on whitespace */
p.words {
    word-wrap: normal;
}    

/* Hides non-wrapped letters */
p.hidden {
    overflow: hidden;
}

/* Outputs a single line, doesn't wrap at all */
p.nowrap {
    white-space: nowrap;
}?

查看更新的小提琴:http://jsfiddle.net/G9z5M/1/

Answer 2

对我来说它有效

white-space: initial;

可能对其他人有帮助。