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

例子:

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

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

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

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


当前回答

YADA(又一个(不同的)答案)

编辑:请参阅下面BoltClock关于类型、标签和元素的评论。我通常不担心语义学,但他的评论非常合适,信息量很大。

Although there are already a bunch of good replies, you indicated that your professor prompted you to post this question so it appears you are (formally) in school. I thought I would expound a little bit more in depth about not only CSS but also the mechanics of web browsers. According to Wikipedia, "CSS is a style sheet language used for describing ... a document written in a markup language." (I added the emphasis on "a") Notice that it doesn't say "written in HTML" much less a specific version of HTML. CSS can be used on HTML, XHTML, XML, SGML, XAML, etc. Of course, you need something that will render each of these document types that will also apply styling. By definition, CSS does not know / understand / care about specific markup language tags. So, the tags may be "invalid" as far as HTML is concerned, but there is no concept of a "valid" tag/element/type in CSS.

现代的可视化浏览器不是单一的程序。它们是不同“引擎”的混合体,各自承担着特定的任务。至少我能想到3个引擎,渲染引擎,CSS引擎和javascript引擎/VM。不确定解析器是否是呈现引擎的一部分(反之亦然),或者它是否是一个单独的引擎,但您可以理解。

Whether or not a visual browser (others have already addressed the fact that screen readers might have other challenges dealing with invalid tags) applies the formatting depends on whether the parser leaves the "invalid" tag in the document and then whether the rendering engine applies styles to that tag. Since it would make it more difficult to develop/maintain, CSS engines are not written to understand that "This is an HTML document so here are the list of valid tags / elements / types." CSS engines simply find tags / elements / types and then tell the rendering engine, "Here are the styles you should apply." Whether or not the rendering engine decides to actually apply the styles is up it.

这里有一个简单的方法来考虑从引擎到引擎的基本流程:解析器-> CSS ->渲染。实际上,它要复杂得多,但这对于初学者来说已经足够好了。

这个答案已经太长了,所以我就到此为止。

其他回答

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

他为什么不想让你用?它们既不常见,也不是HTML5标准的一部分。 从技术上讲,这是不允许的。他们就是个笨蛋。

不过我自己也喜欢。您可能对XHTML5感兴趣。它允许您定义自己的标记,并将它们作为标准的一部分使用。

此外,正如其他人指出的那样,它们是无效的,因此不能携带。

为什么他不知道他们的存在?我不知道,只知道它们不常见。可能他只是不知道你可以。

博士TL;

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

长回答

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

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

有效的CSS/HTML | StackOverflow的要点

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

为什么验证| W3C

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

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

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

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

根据规格:

CSS

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

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

HTML

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

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

然后它说

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

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

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