HTML 自动换行不起作用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11736870/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML Automatic line-break doesn't work?
提问by Luke
I declared widthand marginsbut somehow my lines didn't get wrapped with an automatic line-break.
我声明了width，margins但不知何故我的行没有被自动换行符包裹。
edit: I found the cause. It's because there are no spaces between words:
编辑：我找到了原因。这是因为单词之间没有空格：
teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest teest
回答by mswiszcz
The element where text is should have css declaration:
文本所在的元素应该有 css 声明：
div {
display: block;
width: 200px; /*based on how much width this div should have*/
}
and if it doesn't work try doing:
如果它不起作用，请尝试执行以下操作：
div { word-wrap: break-word }
回答by soytian
try this one by one, it must be helpful for some situation:
一个一个地尝试，它必须对某些情况有帮助：
p{
display: block; /* or inline-block, at least its a block element */
width: 100px; /* or width is certain by parent element */
height: auto; /* height cannot be defined */
word-break: break-all; /* */
word-wrap: break-word; /* if you want to cut the complete word */
white-space: normal; /* be sure its not 'nowrap'! ! ! :/ */
}
回答by muTheTechie
This will print each sentence in each line, without <br>
这将打印每一行中的每个句子，而不 <br>
<p style="font-family:courier;white-space: pre;">
First Line
Second Line
Third Line
</p>
For example check jsfiddle http://jsfiddle.net/muthupandiant/sgp8rjfs/
例如检查 jsfiddle http://jsfiddle.net/muthupdiant/sgp8rjfs/
回答by Prashobh
Try with `word-wrap`
#id
{
word-wrap: break-word ;/*Allows unbreakable words to be broken*/
}
#id
{
word-wrap: normal ;/*Break words only at allowed break points*/
}
回答by Prashobh
The real question is: why on Earth would you want to use in your case?
真正的问题是：你到底为什么要使用 在你的情况下？
That's 6 bytes instead of 1 byte for each space!
这是 6 个字节而不是每个空间的 1 个字节！
Besides the waste of storage- and filesize, search engines will have a ball trying to understand it.
除了存储和文件大小的浪费之外，搜索引擎将有一个球试图理解它。
I would opt-out of whatever reason you have to use and opt-in for plain and simple space (" "), for both SEO and - even more important - less wasted space. This way you'll be achieving the same goal but delivering smaller downloads to website visitors.
无论出于何种原因，我都会选择退出 并选择使用简单和简单的空间（“”），对于 SEO 和 - 更重要的是 - 减少浪费的空间。通过这种方式，您将实现相同的目标，但为网站访问者提供较小的下载量。
回答by Eden Sharvit
another way to do it is by:
另一种方法是：
white-space: pre-wrap; // preserve whitespace, the text is wrapped
overflow-wrap: break-word; // text is wrapped, line break on the end of a word
