为什么CSS使用假元素?

在我的课上，我玩了一下，发现CSS与虚构的元素一起工作。

例子:

imsocool { 颜色:蓝色; ｝ < imsocool >你好< / imsocool >

当我的教授第一次看到我使用它时，他有点惊讶于虚构元素的工作，并建议我简单地将所有的虚构元素更改为带有ID的段落。

为什么我的教授不让我使用合成元素?他们工作效率很高。

另外，为什么他不知道存在虚构元素，并与CSS一起工作。它们不常见吗?

当前回答

为什么CSS使用假元素?因为它不会伤害任何人因为你不应该使用它们。

为什么我的教授不让我使用合成元素?因为如果该元素在未来由规范定义，那么您的元素将具有不可预测的行为。

另外，为什么他不知道存在虚构元素，并与CSS一起工作。它们不常见吗?因为他和大多数其他web开发人员一样，明白我们不应该使用将来可能会随机损坏的东西。

2019-02-22 00:09:03

其他回答

关于其他的答案，有一些事情要么措辞不当，要么可能有点不正确。

FALSE(略):非标准HTML元素“不允许”、“非法”或“无效”。

不一定。他们“不合格”。有什么不同?有些东西可以“不符合”，但仍然是“允许的”。W3C不会派HTML警察到你家把你拖走。

W3C这样做是有原因的。一致性和规范是由一个团体定义的。如果恰好有一个较小的社区出于更特定的目的使用HTML，并且他们都同意一些他们需要的新元素以使事情变得更容易，他们可以拥有W3C所说的“其他适用规范”。(显然，这是一种过于简单的做法，但你可以理解)

也就是说，严格的验证器会将您的非标准元素声明为“无效”。但这是因为验证器的工作是确保符合它验证的任何规范，而不是确保浏览器或使用的“合法性”。

FALSE(略):非标准HTML元素将导致呈现问题

有可能，但不太可能。(将“will”替换为“might”)导致呈现问题的唯一方式是您的自定义元素与另一个规范冲突，例如对HTML规范的更改或同一系统内的另一个规范(如SVG、Math或其他自定义的东西)。

事实上，CSS可以样式化非标准标签的原因是因为HTML规范清楚地指出:

用户代理必须将它们不理解的元素和属性视为语义中立的;将它们留在DOM中(用于DOM处理器)，并根据CSS(用于CSS处理器)对它们进行样式化，但不从中推断任何含义

注意:如果您想使用自定义标记，请记住稍后对HTML规范的更改可能会破坏您的样式，因此请做好准备。然而，W3C不太可能实现<imsocool>标记。

非标准标签和JavaScript(通过DOM)

您可以使用JavaScript访问和修改自定义元素的原因是，规范甚至讨论了如何在DOM中处理它们，DOM是允许您操作页面上元素的(非常可怕的)API。

htmllunknownelement接口必须用于本规范(或其他适用规范)未定义的HTML元素。

TL;DR:符合规范是为了沟通和安全的目的。除了验证器以外，其他任何方法都允许不一致性，验证器的唯一目的是强制一致性，但其使用是可选的。

例如:

var wee = document.createElement('wee');
console.log(wee.toString()); //[object HTMLUnknownElement]

(我确信这会引起争议，但这是我的2分)

2013-12-04 15:16:04

博士TL;

自定义标记在HTML中无效。这可能会导致渲染问题。使将来的开发更加困难，因为代码不可移植。有效的HTML提供了很多好处，比如SEO、速度和专业性。

长回答

有一些争论认为带有自定义标记的代码更有用。

但是，这会导致无效的HTML。这对你的网站不好。

有效的CSS/HTML | StackOverflow的要点

谷歌更喜欢它，所以它对SEO有好处。它使你的网页更有可能在你没有测试过的浏览器上运行。它让你看起来更专业(至少对一些开发人员来说) 兼容的浏览器可以更快地呈现[有效的HTML] 它指出了一堆你可能忽略的、影响你可能没有测试的东西的模糊错误，例如代码页或页面的语言集。

为什么验证| W3C

作为调试工具的验证验证作为一种面向未来的质量检查验证简化了维护验证有助于教授好的实践认可是专业的标志

2013-12-03 14:22:53

从早期开始，CSS就被设计为与标记无关的，因此它可以与任何标记语言一起使用，生成类似DOM结构的树(例如SVG)。任何符合名称令牌生成的标记在CSS中都是完全有效的。所以你的问题是关于HTML而不是CSS本身。

HTML5规范支持带有自定义标记的元素。HTML5标准化了DOM中解析未知元素的方式。所以严格来说，HTML5是第一个支持自定义元素的HTML规范。你只需要使用HTML5 doctype <!文档中的DOCTYPE html>。

至于自定义标签名称本身……

本文档http://www.w3.org/TR/custom-elements/建议您选择的自定义标记至少包含一个“-”(破折号)符号。这样它们就不会与将来的HTML元素冲突。因此，你最好把你的文档修改成这样:

<style>
so-cool {
    color:blue;
}
</style>

<body>
    <so-cool>HELLO</so-cool>
</body>

2013-12-07 23:12:19

虽然CSS有一个叫做“标签选择器”的东西，但它实际上并不知道标签是什么。这将留给文档的语言来定义。CSS被设计成不仅可以与HTML一起使用，还可以与XML一起使用，其中(假设您没有使用DTD或其他验证方案)标签可以是任何东西。您也可以将它用于其他语言，尽管您需要提出自己的语义，以明确“标签”和“属性”对应的内容。

浏览器通常将CSS应用于HTML中的未知标记，因为这被认为比完全破坏要好:至少它们可以显示一些东西。但故意使用“假”标签是非常糟糕的做法。这样做的一个原因是，新标签确实会时不时地定义，如果一个定义看起来有点像你的假标签，但不完全以相同的方式工作，这可能会导致你的网站在新浏览器上出现问题。

2013-12-05 18:37:49

人们很少使用自制的标记，因为它们不太可能在当前的每个浏览器和未来的每个浏览器中都可靠地工作。

浏览器必须将HTML代码解析为它所知道的元素，然后将生成的标记转换为适合文档对象模型(DOM)的其他内容。由于web标准没有涵盖如何处理标准之外的所有内容，web浏览器倾向于以不同的方式处理非标准代码。

在不增加不确定性元素的情况下，使用一堆不同的浏览器进行Web开发已经足够棘手了，这些浏览器都有自己的怪癖。最好的办法是坚持那些标准中的东西，那是浏览器供应商试图遵循的，所以它有最好的机会实际工作。

2013-12-03 14:25:05

为什么CSS使用假元素?

推荐文章

最新文章

标签