Gibi bir şey oluşturmak istiyorum

<menu>
    <lunch>
        <dish>aaa</dish>
        <dish>bbb</dish>
    </lunch>
    <dinner>
        <dish>ccc</dish>
    </dinner>
</menu>

HTML5 yapılabilir? Bunu yapabileceğimi biliyorum

<ul id="menu">
    <li>
        <ul id="lunch">
            <li class="dish">aaa</li>
            <li class="dish">bbb</li>
        </ul>
    </li>
    <li>
        <ul id="dinner">
            <li class="dish">ccc</li>
        </ul>
    </li>    
</ul>

ama çok daha az okunabilir kılmak :(

HTML5 (Are custom elements valid HTML5? the HTML5 spec) olmayacaktır, ancak tarayıcılarda özel etiketleri kullanabilirsiniz.

Hadi özel bir etiket öğesi olarak kullanmak için istediğiniz varsayalım<stack>. İşte yapmanız gerekir

ADIM 1

CSS Stil sayfası (css reset sanırım) - mouse normale Örnek:

 stack{display:block;margin:0;padding:0;border:0; ... }

ADIM 2

Bu kafa (Önemli!) Bu komut ekleyerek Internet Explorer'ın eski sürümlerinde çalışması:

 <!--[if lt IE 9]> 
 <script> document.createElement("stack"); </script>
 <![endif]-->

O zaman özel etiket özgürce kullanabilirsiniz.

<stack>Overflow</stack>

Öznitelikleri ayarlamak çekinmeyin...

<stack id="st2" class="nice"> hello </stack>