【发布时间】：2010-10-10 23:02:24
【问题描述】：
如果我想在看起来像三个空格的行中间有空格，但如果行太长仍然会被打断，我可以在 HTML 中使用什么？
常规空格被折叠（一系列空格看起来与单个空格相同），并且在不间断空格 ( ) 处，行不能被打破。
更新：我认为我真正想要的是一个仍然可以打破长行的＜pre＞标签（我需要显示源代码）。
【问题讨论】：
标签： html whitespace
【发布时间】：2010-10-10 23:02:24
【问题描述】：
两个  后跟一个常规空格怎么样？唯一的缺点（据我所知）是，如果换行符自然落在常规空格上，由于不间断空格，您将在前一行有一些尾随空格，但我没有'认为这不会对页面的实际外观产生影响。
【讨论】：
-
它会，如果那一点长度使出现在该行末尾的 2 个单词中的第一个单词或下一个单词的开头有所不同，因为您仍然填充一个不间断的空格到最后，使其“更长”到分裂机制。此外，即使没有，并且在它们之间中断，下一行的单词也会以空格开头，这也不应该发生。
如果你是not targeting IE（8 除外，标准模式）：
<span style="white-space: pre-wrap"> </span>
对于 IE，<span style="width:3ex"></span> 在 quirks 模式下工作，所以合并它们并...
<span style="width:3ex;white-space:pre-wrap"> </span>
这似乎在我尝试过的任何地方都有效......除了 IE7 标准。哦！
【讨论】：
-
嗯，会有IE8。比如说，四年后，我们的企业客户将更新......
-
请把浏览器支持页面的链接放回去，很好看
一个或多个 em 空格 ( ) 怎么样？当然，这取决于用户的字体大小。如果这在您的设计中不起作用，请考虑使用 en 空格 ( )。
您可能还想查看维基百科上的this table of various spaces。
【讨论】：
-
在理论上，所有这些都应该由符合标准的代理（HA！）折叠到常规空间。
-
如果规范希望它们折叠起来，它们有什么用？但幸运的是，浏览器似乎没有遵循规范的那部分。
-
我只是希望每个人都有适合的字体。
-
实际上应该可以。 HTML 中“空白”的定义故意排除了 U+2002 EM SPACE。 w3.org/TR/html4/struct/text.html#h-9.1
-
有趣...虽然：“本规范并未指明空格字符的行为、呈现或其他方式，除了此处明确标识为空白字符的那些。”
两个不间断空格之间的空格不工作吗？
【讨论】：
-
嘿，这是一个很好的答案。它完美地工作。我必须为电子邮件模板解决方案执行此操作。效果很好。
<wbr>怎么样？
【讨论】：
最好退后一步，问问你要渲染的是什么。这个超宽的空间意味着什么？
【讨论】：
-
我想要一个保留原始缩进的 PRE 标签（但仍会换行）
它在文本之间的左侧空间提供 100 像素 空格示例
span style="margin-left:100px;"
(n_n)
【讨论】：
我实际上有您正在寻找的确切答案。我到处搜索这个答案，没有任何人建议完美。所以，我想出了一个解决方案并尝试了它，结果发现它没有任何缺陷！
Garrow实际上是对的（他只是没有解释或完全接受）。解决方案不是单独放置&nbsp;，而是放置&nbsp;<wbr>。只需进行简单的搜索和替换，然后在每个&nbsp; 之后添加<wbr> 标签。完美运行！
<wbr> 标签是所有主流浏览器都支持的鲜为人知的标签，它告诉浏览器仅在需要时才在此处放置换行符。
更新：我发现一个浏览器在 IE 8 中不能完全正常工作！他们实际上取出了<wbr>标签！我通过创建一个类来解决这个问题：
.wbr:before { content: "\200B" }
不要将&nbsp; 替换为&nbsp;<wbr>，而是将其替换为以下内容：
<wbr><span class='wbr'></span>
在 PHP 中，这看起来像：
$text = str_replace(" "," <wbr><span class='wbr'></span>", $text);
不要忘记添加类。
显然，这有点过分了，用所有这些替换了一个空格，但它确实按预期工作，因为我从未见过它对我有用的标记。
如果这太乱了，另一种解决方案是用双空格替换&nbsp;，后跟一个普通空格。这将交替使用 &nbsp; 和普通空格并在我的测试中工作。
在 PHP 中，这看起来像：
$text = str_replace(" "," ", $text);
希望这会有所帮助！我对此进行了足够的研究；我想我应该把它传下去。
【讨论】：
-
很棒的答案。今天了解
<wbr>