html5 раздел как универсальная оболочка - PullRequest
Новая
       0

html5 раздел как универсальная оболочка

1 голос
/ 04 декабря 2011

Давайте поговорим об элементе section. Я все еще не понимаю, когда его использовать, и кажется, что никто не может точно определить, когда его правильно использовать?

Мне сказали, и я прочитал, что он не должен использоваться как универсальная оболочка для контента. Поэтому я все еще использую div для этой цели, и я редко использую разделы, только статью. Но потом я наткнулся на http://dev.opera.com/,, которые используют его таким образом? Так тогда они используют это неправильно? Но это именно то, как я хотел бы использовать его ... Чтобы разделить страницу на «основной» раздел, где идет контент.

Вот пример того, как я хотел бы расположить свои страницы: 

<html>
<head>

</head>

<body>

<header>

</header>

<section id="main">
    generic content
</section>

<footer>

</footer>

</body>
</html>

1 Ответ

2 голосов
/ 04 декабря 2011

Тег «section» используется для группировки общего содержимого и может использоваться с общим заголовком (h1, h2 или другим).Существует несколько правил использования тега «section», наиболее важные из них:

  1. Не используйте его для структуры шаблона - используйте вместо него другие теги (header, footer, div)
  2. Не используйте его, если можете использовать тег «article» - чтобы ваши статьи могли использоваться на других сайтах
  3. Вы можете использовать «section» в «article» и, конечно,«article» в «section».

Как правило, вы можете использовать его для структурирования страницы путем группировки соответствующего контента: например, в блоге вы можете определить два раздела, один для последней записии еще один для самых старых.Вы также можете иметь «раздел» в «разделе»: вы можете иметь столько разделов (общего содержимого), сколько вам нужно. 

<section>
    <h1>Last post</h1>
    <article>
        [My post...]
        <section>
            [Comments...]
        </section>
    </article>
</section>

<section>
    <h2>Oldest post</h2>
    <article>
        [First post...]
    </article>
    <article>
        [Second post...]
    </article>
    <article>
        [Third post...]
    </article>
</section>

Чтение кода Я думаю, вы можете улучшить свою структуру, используя это:

<html>
    <head>
    </head>

    <body>
        <header>
        </header>

        <div id="main">
            <section>
                Generic content
            </section>
        </div>

        <footer>
        </footer>

    </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...