2010-04-11 19 views
5

मैं संरचना टैग की डेमो नहीं मिल सकता है <header>, <footer>, <articles> ... http://brucelawson.co.uk/tests/html5-elements.html यहाँ, कुछ इस तरह है, लेकिन प्रत्येक तत्व कृपया का प्रकाश डाला साथ, मददएचटीएमएल 5 संरचना टैग डेमो

+0

"इस डेमो में" सबसे अच्छा है - क्या डेमो? – Jonas

+0

डेमो = एचटीएमएल 5 पेज का उदाहरण :) –

+1

यहां HTML क्यों महान है: आप उसका उदाहरण कॉपी कर सकते हैं, इसे टेक्स्ट एडिटर में पेस्ट कर सकते हैं, इसे "test.html" के रूप में सहेज सकते हैं, पानी जोड़ सकते हैं, फिर इसे अपने ब्राउज़र में खोल सकते हैं। तत्काल डेमो! –

उत्तर

4

डब्ल्यूटी ... मुझे यह पता है !!! http://netstream.ru/htmlsamples/html5-blog/index.html यहां, यह बहुत खूबसूरत है !!!

+0

लिंक पर हाइलाइट किए जाने के साथ काम नहीं करता है। – Anil

+0

http://jsbin.com/agoyoj/9/edit?html,css,js ,output इस –

+0

ठीक है धन्यवाद, इसे मिला – Anil

0

दो महान संसाधन HTML5 Doctor और HTML5 Gallery हैं। वे नए एचटीएमएल 5 टैग और क्रमशः उनका उपयोग कर साइटों के उदाहरणों का उपयोग करने के तरीके पर विस्तृत लेख प्रदान करते हैं।

+0

http://www.brucelawson.co.uk/tests/html5-elements.html यहां, कुछ ऐसा है, लेकिन प्रत्येक तत्व –

5

वहाँ सूची के अलावा (के रूप में हमेशा की तरह) पर एक अच्छा लेख: http://www.alistapart.com/articles/previewofhtml5

एक सरल संरचना के लिए यह एक 'अनुभाग' लेकिन यह अनिवार्य नहीं है, तो आप के अंदर 'लेख' और 'एक तरफ' संलग्न के लिए posible है केवल एक खंड

उदाहरण के लिए:

<header>...</header> 
<section> 
    <article>...</article> 
    <aside>...</aside> 
</section> 
<footer>...</footer> 

से एक ही है:

<header>...</header> 
    <article>...</article> 
    <aside>...</aside>> 
<footer>...</footer> 

लेकिन वे एक ही स्थान पर स्थिर नहीं होते, क्योंकि यह टैग बहुत flexibles कर रहे हैं, उदाहरण के लिए:

<header>...</header> 
<section> 
    <header>...</header> 
    <nav>...</nav> 
    <aside id="navbar1">...</aside> 
    <article> 
    <header>...</header> 
    <section>...</section> 
    <aside>...</aside> 
    <footer>...</footer> 
    </article> 
    <aside id="navbar2">...</aside> 
    <footer> 
    </footer> 
</section> 
</section>...</section> 
<nav>...<nav> 
<footer>...</footer> 
0

उपरोक्त पोस्ट सही है, लेकिन नेविगेशन टूल को <nav> टैग का उपयोग करना चाहिए, जो कि अधिक है मानसिक कोड (ध्यान दें: एक वैश्विक कंटेनर के लिए खंड टैग का प्रयोग नहीं करते <div id="main"> या यहाँ तक कि <body> पुन: व्यवस्थित शीर्ष लेख और पाद के साथ प्रयोग):

एचटीएमएल 5 के साथ
<header>...</header> 
<div id="main"> 
    <header>...</header> 
    <nav>...</nav> 
    <aside class="nav_container"> 
    <nav id="navbar1">...<nav> 
    </aside> 
    <article> 
    <header>...</header> 
    <section>...</section> 
    <aside>...</aside> 
    <footer>...</footer> 
    </article> 
    <aside class="nav_container"> 
    <nav id="navbar2">...<nav> 
    </aside> 
    <footer> 
    </footer> 
</div> 
</section>...</section> 
<nav>...<nav> 
<footer>...</footer>