Question

如何在HTML或HTML5中创建自己的html标签，这样我就可以创建自己的html标签和css库比如

<mymenu> ul li or some text </mymenu>

<heading> Yeah My Own Heading</heading>

是他们这样做的方法吗？如果是的，请告诉我我是多么好奇。并告诉我在制作个性化标签后我应该遇到什么问题（如果你知道的话）。

Answer 1

这样做的“正确”方法是使用类：<div class="mymenu">。话虽这么说，我所知道的每个浏览器都会显示你的<mymenu>标签就好了，你可以根据需要设置它的样式：

mymenu {
    display    : block;
    background : teal;
}

演示：http://jsfiddle.net/cwolves/DPMCM/2/

请注意，IE＆lt; 9不会立即正确显示。要解决这个问题，只需在页面的任何位置使用以下JS（在创建元素之前）：

document.createElement('mymenu');

将告诉IE CSS引擎存在mymenu标记。

Answer 2

这是html，而不是xml。正确的方法是使用<div>并应用您自己的.mymenu类，您可以将其设置为菜单，或者定义应该如何显示的标题类。

Answer 3

可以在＆lt;中执行自定义元素。 IE9，但它要求（没有javascript）小心使用doctypes，名称空间，以及完全正确的xhtml，匹配的DTD。

像这样......

<!DOCTYPE html SYSTEM "http://your.domain/xhtml-custom.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' 
      xmlns:custom="http://your.domain/" 
      xml:lang='en-US'>

DTD包含的内容......

<!ENTITY % attrs "%coreattrs; %i18n; %events;">
<!ENTITY % custom "custom:attribution | custom:quote ">
<!ENTITY % block "p | div | isindex |fieldset | table | %custom; ">
<!ENTITY % Flow "(#PCDATA | %block; | form )*">
<!ENTITY % custom "custom:attribution | custom:quote">
<!ELEMENT custom:attribution %Flow;>
<!ATTLIST custom:attribution %attrs;>

......等等。

您最终会遇到需要命名空间（例如custom：customtag）的情况，并且使用CSS定位它需要转义冒号......

custom\:customtag { display:block; }

...这太麻烦了 - 考虑到使用自定义元素的重点是产生更多的语义标记。

我在IE6的时代对此进行了详细调查，当时xhtml似乎可能是未来并解决了所有问题，但从未试图在解决方案的剪切繁琐性质的任何地方实施它。

世界上大多数人都放弃了xhtml，因为它太麻烦了。

在一天结束时，用于更好语义的自定义元素几乎不值得，因为无论你做什么，你的标记都可能会受到演示需求的影响（而且我已经尝试了几十年了）你只是不能完全在线将内容与演示文稿分开。

Answer 4

是的，有办法！

CSS代码：

mymenu {
    display    : block;
    background : black;

}

heading {
    font-family: cursive;
    /* MORE CUSTOMIZE */
}

HTML代码：

<mymenu> ul li or some text </mymenu>
<heading> Yeah My Own Heading</heading>

或者如果你想自定义h1 ..

h1 {
/*etc..*/
}

Answer 5

在这里查看HTML5 Shiv的故事：

http://paulirish.com/2011/the-history-of-the-html5-shiv/

您可以使用相同的方法启用自定义标记。

但不要。这只是愚蠢的。使用span或div与类。

Answer 6

在CSS中创建一个标签，没有类（。）或id（＃）。

CSS：

mymenu {
    /* Styling Here */
}

heading {
    /* Styling Here */
}

HTML：

<mymenu> ul li or some text </mymenu>
<heading> Yeah My Own Heading </heading>

Answer 7

为此，您可以使用css创建自定义标记：

c-r {
    color:red;
}

我在Custom Markup上执行此操作。检查一下，因为它可能已经有了你想要的东西。

我该如何创建自己的HTML标签？

7 个答案: