在我的课上,我玩了一下,发现CSS与虚构的元素一起工作。
例子:
imsocool { 颜色:蓝色; } < imsocool >你好< / imsocool >
当我的教授第一次看到我使用它时,他有点惊讶于虚构元素的工作,并建议我简单地将所有的虚构元素更改为带有ID的段落。
为什么我的教授不让我使用合成元素?他们工作效率很高。
另外,为什么他不知道存在虚构元素,并与CSS一起工作。它们不常见吗?
在我的课上,我玩了一下,发现CSS与虚构的元素一起工作。
例子:
imsocool { 颜色:蓝色; } < imsocool >你好< / imsocool >
当我的教授第一次看到我使用它时,他有点惊讶于虚构元素的工作,并建议我简单地将所有的虚构元素更改为带有ID的段落。
为什么我的教授不让我使用合成元素?他们工作效率很高。
另外,为什么他不知道存在虚构元素,并与CSS一起工作。它们不常见吗?
当前回答
关于其他的答案,有一些事情要么措辞不当,要么可能有点不正确。
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分)
其他回答
博士TL;
自定义标记在HTML中无效。这可能会导致渲染问题。 使将来的开发更加困难,因为代码不可移植。 有效的HTML提供了很多好处,比如SEO、速度和专业性。
长回答
有一些争论认为带有自定义标记的代码更有用。
但是,这会导致无效的HTML。这对你的网站不好。
有效的CSS/HTML | StackOverflow的要点
谷歌更喜欢它,所以它对SEO有好处。 它使你的网页更有可能在你没有测试过的浏览器上运行。 它让你看起来更专业(至少对一些开发人员来说) 兼容的浏览器可以更快地呈现[有效的HTML] 它指出了一堆你可能忽略的、影响你可能没有测试的东西的模糊错误,例如代码页或页面的语言集。
为什么验证| W3C
作为调试工具的验证 验证作为一种面向未来的质量检查 验证简化了维护 验证有助于教授好的实践 认可是专业的标志
根据规格:
CSS
类型选择器是使用CSS限定名称语法编写的文档语言元素类型的名称
我以为这是元素选择器,但显然它实际上是类型选择器。规范继续讨论了CSS限定名称,它对名称的实际内容没有任何限制。也就是说,只要类型选择器匹配CSS限定名称语法,它就是技术上正确的CSS,并将匹配文档中的元素。对于特定规范(HTML或其他规范)中不存在的元素,没有特定于css的限制。
HTML
在文档中包含您想要的任何标签没有官方限制。但是,文档确实说了
作者不能将元素、属性或属性值用于其适当的预期语义目的以外的目的,因为这样做会妨碍软件正确处理页面。
然后它说
作者不能使用本规范或其他适用规范不允许的元素、属性或属性值,因为这样做会大大增加将来扩展该语言的难度。
我不确定具体在哪里或者规范是否说未知元素是允许的,但它确实谈到了HTMLUnknownElement接口的未知元素。有些浏览器甚至不能识别当前规范中的元素(我想到了IE8)。
虽然有一个自定义元素的草案,但我怀疑它还没有在任何地方实现。
他为什么不想让你用?它们既不常见,也不是HTML5标准的一部分。 从技术上讲,这是不允许的。他们就是个笨蛋。
不过我自己也喜欢。您可能对XHTML5感兴趣。它允许您定义自己的标记,并将它们作为标准的一部分使用。
此外,正如其他人指出的那样,它们是无效的,因此不能携带。
为什么他不知道他们的存在?我不知道,只知道它们不常见。可能他只是不知道你可以。
虽然浏览器通常会将CSS与HTML标记关联起来,不管它们是否有效,但你绝对不应该这样做。
从CSS的角度来看,这在技术上没有什么问题。然而,在HTML中绝对不应该使用编造的标签。
HTML是一种标记语言,这意味着每个标记对应于特定类型的信息。
您创建的标记不对应于任何类型的信息。这将产生来自网络爬虫的问题,如谷歌。
阅读有关正确标记重要性的更多信息。
Edit
div指的是多个相关元素的组,意味着以块形式显示,并可以这样操作。
span指的是与它们当前所在的上下文样式不同的元素,它们应该内联显示,而不是作为块显示。一个例子是句子中的几个单词需要全部大写。
自定义标记与任何标准都不相关,因此span/div应该与class/ID属性一起使用。
有一些非常特殊的例外情况,比如Angular JS
为什么CSS使用假元素?
(大多数)浏览器被设计成(在某种程度上)向前兼容未来添加的HTML。未识别的元素被解析到DOM中,但没有与它们相关的语义或专门的默认呈现。
当一个新元素被添加到规范中时,有时CSS、JavaScript和ARIA可以用来在旧的浏览器中提供相同的功能(元素必须出现在DOM中,以便这些语言能够操作它们来添加该功能)。
(有一个自定义元素的规范,但是它们有特定的命名要求,并且需要使用JavaScript进行注册。)
为什么我的教授不让我使用合成元素?
它们不被HTML规范所允许 它们可能与将来同名的标准元素冲突 可能有一个现有的HTML元素更适合这个任务
也;为什么他不知道构成元素的存在并与CSS一起工作。它们不常见吗?
是的。人们不使用它们是因为它们有上述问题。