57

我早就认识到 HTML 文件中的任何一组空格都只会显示为一个空格。例如,这个:

<p>Hello.        Hello. Hello. Hello.                       Hello.</p>

显示为:

你好。你好。你好。你好。你好。

这非常好,就好像您需要多个预先格式化的文本空格一样,您可以使用 <pre> 标记。但原因是什么?更准确地说,为什么这会出现在 HTML 规范中?

4

12 回答 12

45

空格在 HTML 中是压缩的,因为 HTML 的格式化方式和呈现方式之间存在区别。考虑这样的页面:

<html>
    <body>
        <a href="mylink">A link</a>
    </body>
</html>

例如,如果 HTML 使用空格缩进,则链接前面将有几个空格。

于 2009-01-11T19:45:09.820 回答
20

尝试解决“为什么”可能是因为 HTML 是基于SGML以这种方式指定的。它又基于60 年代初的GML 。空白处理的原因很可能是因为当时数据一次输入一张“卡片”,这可能导致句子和段落的意外中断。旧 GML 的一个区别是它规定句子之间必须有两个空格(就像旧的打字机规则一样),这可能已经确立了空格独立于标记的先例。

于 2009-01-11T20:15:12.847 回答
19

正如其他人所说,它在 HTML 规范中。

如果要在输出中保留空格,可以使用<pre> 标签

<pre>This     text has              extra spaces

and

    newlines</pre>

但这通常也会以不同的字体显示文本。

于 2009-01-11T19:45:17.183 回答
13

它不仅在规范 ,而且有一定的意义。如果没有压缩空格,则必须将所有 html 放在一行中。所以是这样的:

<div>
    <h1>Title</h1>
    <p>
       This is some text
       <a href="#">Read More</a>
    </p>
</div>

会与整个地方的空间有一些奇怪的对齐。使其正确的唯一方法是压缩该代码,这将难以维护。

于 2009-01-11T19:45:24.610 回答
13

“为什么将多个空格转换为单个空格?”

首先,“为什么”的问题很难回答。它在规范中。这几乎是它的结束。

考虑有几种空白。

  • 标签之间的空白。 <p>\n<b>hi</b>\n</p>

  • 标记内内容中的空白。 <p>Hi <i>everyone</i>.</p>

  • <pre>或 CDATA 部分中的空白。

前两个很难区分。标签之间的空格,即使在 XML 中,也是“可选的”。但是,当您拥有所谓的“混合内容模型”——标签与内容混合时——“标签之间”、“在内容中但在标签之间”和“在内容中但不在标签之间”的微妙之处是不可能的整理。

所以他们不整理。标签之间的空格和内容中的空格都是可选的。

于 2009-01-11T19:45:48.773 回答
8

如果浏览器不这样做,可能很难格式化您的 HTML 代码以使其易于阅读。例如,您可能希望像这样格式化您的代码:

<html>
<body>
    <div>
        I like to indent all content that is inside div tags.
    </div>
</body>
</html>

如果浏览器没有忽略 div 标签内文本之前的八个左右的空格,您的网页可能看起来不像您想要的那样。

于 2009-01-11T20:01:44.747 回答
5

通常,这些设计决策没有记录在任何规范中,只能从碰巧可公开访问或由规范作者自己解释的工作组讨论档案中收集。但是,在这种特殊情况下,HTML 3.2确实声明了以下内容:

除了在文字文本中(例如PRE元素),HTML 将连续的空白字符序列视为等同于单个空格字符(ASCII 十进制 32)。这些规则允许作者在直接编辑标记文本时具有相当大的灵活性。请注意,未来对 HTML 的修订可能允许相对于由关联样式表定义的制表符规则来解释水平制表符(ASCII 十进制 9)。

您今天看到的行为当然比 HTML 3.2 中指定的要复杂得多,但我相信推理仍然适用。这种灵活性可能有用的一个例子是当你有一个很长的段落你打算硬换行和缩进时:

<H1>Lorem ipsum</H1>
<P>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fastidii oportere
   consulatu no quo. Vix saepe labores an, pri illud mentitum et, ex suas quas
   duo. Sit utinam volutpat ea, id vis cibo meis dolorum, eam docendi
   accommodare voluptatibus no. Id quaeque electram vim, ut sed singulis
   neglegentur, ne graece alterum has. Simul partiendo quaerendum et his.

如果空白没有折叠,您最终会得到一个具有异常大间隙的段落,其中文本由于缩进而被硬换行。

没有其他 HTML 规范建议此设计决策背后的任何类型的推理。特别是HTML 4只描述了折叠行为,而 HTML5 和 live 规范都遵循 CSS,它也没有解释任何东西。早期版本的 HTML 也不包含任何解释,尽管以下摘录确实出现在HTML 2.0的示例片段中:

<OL>
...
  <UL COMPACT>
  ...
  <LI> Whitespace may be used to assist in reading the
       HTML source.
  </UL>
...
</OL>
于 2017-08-02T04:37:42.823 回答
4

它在 HTML 规范中。这是关于将单词间空间呈现为 ASCII 空间的部分。

http://www.w3.org/TR/html401/struct/text.html

于 2009-01-11T19:40:39.830 回答
4

很简单,它在规范中。

从 HTML 规范,第 9.1 节

特别是,用户代理在产生输出字间距时应该折叠输入的空白​​序列。

于 2009-01-11T19:41:01.467 回答
3

HTML 的定义/规范明确声明忽略多余的空格。

如果要包含额外的空格,请使用<pre>标签或&nbsp;

于 2009-01-11T19:43:49.183 回答
3

要回答为什么这在 H​​TML 规范中?您必须考虑 HTML 的起源。

Tim Berners-Lee 设计了用于共享科学文档的 HTML。他基于 SGML 中预先存在的语法思想,它也有类似的空白处理。

可以想象,CERN 的早期 HTML 编写者在没有所见即所得工具的帮助下这样做,因此以这种方式处理空格的能力有助于此类手写源文件的易读性。

于 2009-01-11T20:21:03.913 回答
2

还有一个排版的答案:无论你在学校的打字老师可能告诉你什么,单词和句子之间应该只有一个空格。

在句子之间使用一个空格

在句子之间使用单个单词空间

于 2009-01-11T20:21:25.160 回答