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

例子:

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

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

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

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


当前回答

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

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

其他回答

这对于html5来说是可行的,但是你需要考虑到旧的浏览器。

如果你决定使用它们,一定要注释你的html!!有些人可能很难弄清楚它是什么,所以注释可以节省他们大量的时间。

就像这样,

<!-- Custom tags in use, refer to their CSS for aid -->

当你创建自己的自定义标签/元素时,旧的浏览器将不知道这是什么,就像html5的元素如nav/section一样。

如果你对这个概念感兴趣,那么我建议你用正确的方法去做。

开始 自定义元素允许web开发人员定义新的HTML类型 元素。该规范是几个新的API原语之一 Web组件的保护伞,但它很可能是最 重要的。如果没有通过解锁的特性,Web组件就不存在 自定义元素: 定义新的HTML/DOM元素创建从其他元素扩展的元素 元素从逻辑上将自定义功能捆绑在一起 扩展现有DOM元素的API

您可以使用它做很多事情,并且它确实可以使您的脚本更漂亮,就像本文想说的那样。自定义元素在HTML中定义新元素。

让我们回顾一下,

Pros

非常优雅,易于阅读。 很高兴没有看到那么多的潜水者。: p 让代码有一种独特的感觉

Cons

较老的浏览器支持是需要考虑的重要因素。 如果不了解自定义标记,其他开发人员可能不知道该做什么。(向他们解释或添加评论告知他们) 最后要考虑的一件事,但我不确定,是块和内联元素。通过使用自定义标签,你最终会写更多的css,因为自定义标签不会有默认的一面。

选择完全取决于您,您应该根据项目的要求来选择。

更新1/2/2014

这里有一篇非常有用的文章,我发现并打算分享,自定义元素。

为什么要自定义元素?自定义元素让作者进行定义 他们自己的元素。作者将JavaScript代码与自定义标记相关联 名称,然后像使用任何标准一样使用这些自定义标记名称 标签。 例如,注册后的一种特殊按钮叫做 超级按钮,像这样使用超级按钮: 自定义元素仍然是元素。我们 能像其他的一样轻松地创建、使用、操纵和组合它们吗 今天的标准。

这似乎是一个非常好用的库,但我注意到它没有通过windows的构建状态。我相信这也是一个预alpha版本,所以我会密切关注它的发展。

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

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

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

我认为编造的标签可能比带有id的p更令人困惑或不清楚(通常是一些文本块)。我们都知道带ID的p是一个段落,但是谁知道创建的标记是用来干什么的呢?至少我是这么想的。:)因此,这更多的是一个风格/清晰度问题,而不是功能问题。

虽然浏览器通常会将CSS与HTML标记关联起来,不管它们是否有效,但你绝对不应该这样做。

从CSS的角度来看,这在技术上没有什么问题。然而,在HTML中绝对不应该使用编造的标签。

HTML是一种标记语言,这意味着每个标记对应于特定类型的信息。

您创建的标记不对应于任何类型的信息。这将产生来自网络爬虫的问题,如谷歌。

阅读有关正确标记重要性的更多信息。

Edit

div指的是多个相关元素的组,意味着以块形式显示,并可以这样操作。

span指的是与它们当前所在的上下文样式不同的元素,它们应该内联显示,而不是作为块显示。一个例子是句子中的几个单词需要全部大写。

自定义标记与任何标准都不相关,因此span/div应该与class/ID属性一起使用。

有一些非常特殊的例外情况,比如Angular JS

根据规格:

CSS

类型选择器是使用CSS限定名称语法编写的文档语言元素类型的名称

我以为这是元素选择器,但显然它实际上是类型选择器。规范继续讨论了CSS限定名称,它对名称的实际内容没有任何限制。也就是说,只要类型选择器匹配CSS限定名称语法,它就是技术上正确的CSS,并将匹配文档中的元素。对于特定规范(HTML或其他规范)中不存在的元素,没有特定于css的限制。

HTML

在文档中包含您想要的任何标签没有官方限制。但是,文档确实说了

作者不能将元素、属性或属性值用于其适当的预期语义目的以外的目的,因为这样做会妨碍软件正确处理页面。

然后它说

作者不能使用本规范或其他适用规范不允许的元素、属性或属性值,因为这样做会大大增加将来扩展该语言的难度。

我不确定具体在哪里或者规范是否说未知元素是允许的,但它确实谈到了HTMLUnknownElement接口的未知元素。有些浏览器甚至不能识别当前规范中的元素(我想到了IE8)。

虽然有一个自定义元素的草案,但我怀疑它还没有在任何地方实现。