今天有人试图通过挑战我对HTML的一般知识来骚扰和贬低我,我从未声称拥有这些知识,因为我才刚刚开始学习它。她问了我以下两个问题:
问题1.如果我创建一个只有字符串的 html 页面,而没有在其中编写任何 html 标记(没有正文、没有 html、没有文档类型),那么为什么浏览器仍然呈现它并显示字符串就好像它是一个段落?
为此,我使用了我最好的猜测,即浏览器仍然设法将其显示为段落,因为这是它的最佳猜测,它通过假设这是作者想要的来弥补缺失的标签,从而"放置"这些标签即使我们从未手动编写过它。
问题2.在上面的例子中,如果我在 html 的源代码中以不同的行编写几个字符串,浏览器仍然将它们显示为一行文本。
再一次,我使用了我最好的猜测,并得出结论,HTML是一种自由格式的语言,因此它不会关心源代码中有多少空格或缩进。
然而,她似乎并不高兴。我的答案错了吗?如果是,那么他们是完全还是部分错误,这些问题的正确答案是什么?
感谢您阅读并耐心等待描述。
问题1.如果我创建一个只有字符串的 html 页面,而没有在其中编写任何 html 标记(没有正文、没有 html、没有文档类型),那么为什么浏览器仍然呈现它并显示字符串就好像它是一个段落?
为此,我使用了我最好的猜测,即浏览器仍然设法将其显示为段落,因为这是它的最佳猜测,它通过假设这是作者想要的来弥补缺失的标签,从而"放置"这些标签即使我们从未手动编写过它。
由于在这两种情况下都不使用该<!DOCTYPE ...>
,因此在初始插入模式的最后一步中找不到该,因此整个文档以 Quirks 模式呈现。
虽然浏览器(至少是Firefox和Chrome)不会将其解析为段落,但默认情况下,它们确实会呈现与Quirks模式下的段落相同的简单字符串。这是因为"当文档处于怪癖模式时,正文元素顶部或底部的 HTML 元素的垂直边距预计会折叠为零"(来源,更多关于折叠边距的信息),因此body
的margin-top
有效地消耗了p
的margin-top
。由于简单字符串没有边距,因此不会发生任何操作。最终结果是文本段落和文本本身的显示相同。
这是浏览器处理简单字符串的方式。特别注意 DOM 视图,它显示了文档的最终结构。为了进行比较,请参阅段落的外观。虽然它们在渲染中可能看起来相同,但结构并不相同。
现在,为了说明我关于折叠边距的观点,请用一个div
包裹内容(文本或段落),该具有查看未折叠边距的border
。这是浏览器处理纯文本的方式,而这是浏览器处理段落的方式。
但是,如果包含<!DOCTYPE ...>
(以防止浏览器进入 Quirks 模式),则纯文本文档的显示方式将与带有段落的文档不同(p
元素的margin-top
不会折叠到 body
元素的margin-top
中)。
问题2.在上面的例子中,如果我在 html 的源代码中以不同的行编写几个字符串,浏览器仍然将它们显示为一行文本。
再一次,我使用了我最好的猜测,并得出结论,HTML是一种自由格式的语言,因此它不会关心源代码中有多少空格或缩进。
HTML 将所有空格(除非white-space
设置为normal
以外的其他内容)视为单个空格(折叠)。因此,testnntest
相当于test test
.
然而,她似乎并不高兴。我的答案错了吗?如果是,那么他们是完全还是部分错误,这些问题的正确答案是什么?
你的结论有些正确,但不能很好地处理边缘情况(例如,如果浏览器更改了p
元素的字体/颜色/等)。
HTML 和 BODY 标记是可选的,请参阅 http://www.w3.org/TR/REC-html40/struct/global.html#h-7.3。
将它们从文档中删除被视为文本/html类型,这会导致空白折叠为单个空白;这就是为什么源中不同行中的单词在一行之后呈现的原因。
Q1:
我不认为浏览器会将单个字符串显示为段落。这样做的原因是,正如您所说,单独行上的任何后续字符串都呈现在同一块中。您可以使用 chrome 网页检查器 (CTRL+SHIFT+I) 进行检查。任何不是标签或脚本/样式表(或文档类型)的东西都会被浏览器显示。
问2:
HTML 对换行符不敏感。
如果您仍然不满意,请检查规格:http://developers.whatwg.org/