自定义 HTML 元素并在 CSS 中使用它们 [重复]

Question

是否可以在html中使用<g></g>等自定义标签来对文本进行分组？然后我想通过 CSS 将样式应用于这些自定义标签，这些标签完成与圆角矩形和蓝色文本相同的事情。

需要所有这些的原因是因为我在小提琴中设置它的第一种方式使用生成的内容 - 这不是 DOM 的一部分，因此无法突出显示/选择蓝色文本，以便您可以复制/粘贴。

我想出的解决方案是让生成的内容不生成，而只是通过分隔符将标签与实际内容区分开来，在这种情况下，|字符。

所以我需要一种方法来产生与原始输出相同的输出，但使用新的语法，这样文本就可以复制了。

http://jsfiddle.net/xa3apsdc/20/

Answer 1

改为<span class="g"></span>，问题就解决了。

在自定义标签上旧版浏览器不支持，但您可以将它们作为其他不支持的（例如画布）标签处理，因此如果您真的需要它，您可以这样做：http://jsfiddle.net/xa3apsdc/22/

无论如何你都会遇到一些问题：custom tags not working in ie8

关键是将display 规则设置为元素：display:block; 或display:inline-block，然后您就可以开始了。