对HTML5元素进行样式化

我知道设置< section>标签,但是< header>和< footer>标签.如果使用这些标签提供了一个更加语义的标记,那么应该使用它们,但是如果不能使用< div>仍然需要插入标签内以包装内容并对其进行风格化.

我知道< header>可以样式,但我不知道这样做是否正确.

所以问题是:应该html5标签的样式,或应该是< div>放在里面照顾造型吗?

解决方法

规范中的任何内容都表示您无法或不应用HTML5元素,例如< section>或<制品>.它只是表示你不应该将某个语义的HTML5元素放在某个地方,以便“定型”.使用< div>代替.

所以如果你有一个语义的原因来添加< section>或<制品>在某个地方,然后通过一切手段添加它,也可以自由地风格.但是,如果您必须为您的标记包装一些标记(例如添加边框或浮动左等),但是该部分在标记中没有任何语义含义,则使用< ; DIV取代. 例如:

<div class="mainBox">
    <nav class="breadcrumbs">
        <ol>
            <li>...list of links (snip)....</li>
        </ol>
    </nav>

    <section>
        <h1>Latest Tweets From Twitter</h1>

        <article>
            //... a Tweet (snip)... //
        </article>

        <article>
            //... a Tweet (snip)... //
        </article>

        //... lots more Twitter posts (snip)... //

    </section>

</div>

< section>元素是您的页面的主要部分(即,您的Twitter的列表),并且在开始时还有一个标题是必需的.但是它包裹在一个div.mainBox元素中,因为也许你想要围绕面包屑和部分部分包围边框,即.它纯粹是为了造型.但是,没有什么可以阻止您将< section>和< article>元素也.

相关文章

HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码