Question

只是玩弄HTML / CSS，并想知道浏览器如何处理未包含在标记中的文本块。当我运行以下代码时，所有三个文本块（<head>，<head>和<body>之间，以及<body>）都会选择红色＆＃34;正文＆＃ 34;造型。

为什么<body>之外的文字字符串会选择＆＃34; body＆＃34;规则？

HTML

<html>
  <head>
    <title>Test web page</title>
   head text outside a tag
  </head>
  Text node between head and body
  <body>
    <h1>Header</h1>
    <p>
      Some paragraph text
    </p>
    some body text outside a tag
  </body>
</html>

CSS

body {
  color:red;
}

h1, p {
  color:lightblue;
}

head {
  color: yellow;
}

Answer 1

你的问题与CSS无关; CSS只会使问题可见。

当浏览器解析HTML时，它遵循许多规则。

头部不能包含纯文本;身体可以
某些开始和结束标记是可选的
如果有错误;试着解决它

因此，如果解析器在头部遇到一些纯文本，它就知道文本不属于那里。它首先插入一个不可见的</head>结束标记，后跟一个不可见的<body>开始标记，然后愉快地继续解析。
这甚至不是工作中的错误处理，这正是解析规则的正常工作方式！

错误处理例程仅在解析器遇到</head>标记时才会生效，而该标记在正文中是不允许的。然后它会忽略此标记并继续。与之后的<body>标记相同，也不允许在正文中使用。{ 所以，这就是它的作用，以及为什么你得到这些结果。

在CSS中选择HTML文本节点的规则是什么？

1 个答案: