0

我一直在使用 HTML5 的一些元素,但从来没有真正让自己投入其中,所以我优先考虑让我的流浪汉开始工作。

我已经阅读了我能找到的每一个方面,并为自己建立了一个小测试器。我已经通过大纲工具运行它,一切似乎都胜过了。只是想知道是否有人愿意查看我的完整测试文档,看看我是否忽略了某些事情/做任何严重错误的事情。

<body>
    <!-- Header --> 
    <header>
        <img src="logo.jpg" alt="Logo" />
        <h1>Slogan</h1>
        <nav>
            <header><h2 class="hide-element">Navigation</h2></header>
            <ul>
                <li>Nav Item</li>
                <li>Nav Item</li>
                <li>Nav Item</li>
            </ul>
        </nav>
    </header>       
    <!-- Main Content -->       
    <section id="wrapper">
        <header>
            <h2>Page Heading</h2>
        </header>               
        <section>               
            <h2 class="hide-element">Section Heading</h2>
            <article>
                <header>
                    <h3>Sub Heading</h3>
                    <time datetime="2013-02-08">February 8th 2013</time>
                </header>
                <p>Section Text</p>
                <footer>
                    Like Button
                </footer>
            </article>

            <article>
                <header>
                    <h3>Sub Heading</h3>
                </header>
                <p>Section Text</p>
                <figure>
                    <img src="" alt="" />
                    <figcaption>Caption</figcaption>
                </figure>
                <footer>
                    Like Button
                </footer>
            </article>              
        </section>

        <aside>
            <h2 class="hide-element">Sidebar</h2>
            <nav>
                <header>
                    <h3>Categories</h3>
                </header>
                <ul>
                    <li>Sidebar Nav Item</li>
                    <li>Sidebar Nav Item</li>
                    <li>Sidebar Nav Item</li>
                </ul>
            </nav>
        </aside>            
    </section>

    <!-- Footer -->     
    <footer>
        <nav>
            <h3>Links</h3>
            <ul>
                <li>Link</li>
                <li>Link</li>
                <li>Link</li>
            </ul>
        </nav>
        <section>
            <h3>Social</h3>
            <a href="">Link to Twitter</a>
            <a href="">Link to Facebook</a>
        </section>
        <p class="copyright">&#169; Copyright 2013</p>
        <p class="credit"><a href="" target="_blank">Credit</a></p>
    </footer>   
</body>

更新

在标签内添加了 h2 周围。没有意识到你可以在里面。谢谢

将 div#wrapper 更改为部分。

4

1 回答 1

1

div元素没有对content 进行分段,因此这意味着您header在同一大纲级别有两个元素,一个是 的直接子级,一个是body的直接子级div#wrapper。这在规范中当然不是无效的,甚至是不鼓励的,但它看起来确实有点奇怪。如果您希望它成为内容的标题,#wrapper而不仅仅是整个页面的第二个标题,那么您的#wrapper元素应该是 asection或 an article。除此之外,我认为标记结构很好。

于 2013-02-08T13:10:52.580 回答