Создание оболочки в HTML5 / CSS3 - PullRequest
3 голосов
/ 01 февраля 2012

Я пишу новый сайт на HTML5 и CSS3. Мне нужно сделать несколько внутренних оболочек для центрирования контента (шириной 960 пикселей). Я обычно делаю это через что-то вроде

<style>
 .nav { height:40px; background:#000; }
 .wrapper { width:960px; margin:auto; }
</style>
<div class="nav">
 <div class="wrapper">
  Home News Blog etc etc
 </div>
</div>

Тем не менее, я новичок в использовании новых элементов HTML 5, таких как header, nav, article и т. Д., И мне интересно, как сделать обертку, похожую на описанную выше, но лучше?

Ответы [ 4 ]

2 голосов
/ 01 февраля 2012

Если вы ищете альтернативные методы, вы также можете использовать тело

body{ margin: 0 auto; width: 960px; }
2 голосов
/ 09 февраля 2013

Это действительно допустимо:

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8">
    <title>Wrapping up HTML5</title>
</head>
<body>
<div id="wrapper">
<header><h1>Using a HTML5 wrapper</h1></header>
    <section>
        <article>
            <hgroup>
            <h1>This is actually legal</h1>
            <h2>Just wrap everything in a div, just like before</h2>
            </hgroup>
            <p>But it's probably better to simply use the body tag.</p>
        </article>
    </section>
    <footer><p>Love from Kebman</p></footer>
</div>
</body>
</html>

Однако, вероятно, целесообразно просто использовать <body> в качестве оболочки.В конце концов, он чище и добавляет меньше HTML.

1 голос
/ 01 февраля 2012

Хорошо, используйте элемент nav для nav, иначе div подходит для его деления.

0 голосов
/ 21 января 2016

Я все еще помещаю все в div обертки, даже используя header, nav, footer, main, так как мне легче контролировать весь контент

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