繁体   English   中英

如何创建自己的 HTML 标签?

[英]how can i create my own HTML tag?

how can i create my own html tags in HTML or HTML5 so i can make my own html tag and css library such as

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

<heading> Yeah My Own Heading</heading>

他们有办法做到这一点吗? 如果是的话,请告诉我我真的很好奇。 并告诉我在制作个性化标签后我会遇到什么问题(如果你知道的话)。

这样做的“正确”方法是使用类: <div class="mymenu"> 话虽如此,我所知道的每个浏览器都会很好地显示您的<mymenu>标记,并且您可以根据需要设置它的样式:

mymenu {
    display    : block;
    background : teal;
}

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

请注意,IE<9 不会立即正确显示。 为了解决这个问题,只需在页面上的任何位置(在创建元素之前)使用以下 JS:

document.createElement('mymenu');

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

这是 html,而不是 xml。 正确的做法是使用<div>并应用您自己的.mymenu class ,您可以将其设置为看起来像一个菜单,或者一个标题 class 来定义它的外观。

是的,有办法!

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..*/
}

可以在 < 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,因为它太麻烦了。

归根结底,为了更好的语义而定制元素几乎不值得,因为无论你做什么,你的标记都可能会受到演示需求的影响(我已经尝试了几十年了)你就是不能完全在线将内容与演示分开。

在此处查看 HTML5 Shiv 的故事:

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

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

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

在 CSS 中创建一个标签,没有 class (.) 或 id (#)。

CSS:

mymenu {
    /* Styling Here */
}

heading {
    /* Styling Here */
}

HTML:

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

为此,您可以使用 css 创建自定义标签:

c-r {
    color:red;
}

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM