HTML 5 Структурные теги демо - PullRequest
Новая
       13

HTML 5 Структурные теги демо

5 голосов
/ 11 апреля 2010

Я не могу найти демо тегов структуры <header>, <footer>, <articles> ... http://brucelawson.co.uk/tests/html5-elements.html Здесь как-то так, но с выделением каждого элемента Пожалуйста, помогите

Ответы [ 5 ]

5 голосов
/ 13 октября 2010

В списке есть хорошая статья (как обычно): http://www.alistapart.com/articles/previewofhtml5

Для простой структуры можно заключить «article» и «aside» в «section», но это не обязательно, если у вас есть только один раздел.

Например: 

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

совпадает с: 

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

Но поскольку эти теги очень гибкие, они не привязаны к одному месту, например: 

<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>
4 голосов
/ 11 апреля 2010

WT ... Я НАШЕЛ ЭТО !!! http://netstream.ru/htmlsamples/html5-blog/index.html Вот это великолепно !!!

0 голосов
/ 12 апреля 2012

Знакомство с HTML5 - лучший способ

0 голосов
/ 29 марта 2011

Пост выше верен, но навигационные инструменты должны использовать тег <nav>, который является более семантическим кодом. (примечание: не используйте тег раздела для глобального контейнера, используйте <div id="main"> или даже <body> с переставленным верхним и нижним колонтитулами): 

<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>
0 голосов
/ 11 апреля 2010

Два замечательных ресурса: HTML5 Doctor и HTML5 Gallery . Они предлагают подробные статьи о том, как использовать новые теги HTML5 и примеры сайтов, использующих их соответственно.

...