对阵Flash 实战HTML 5技巧之页面设计

 

    在上一篇文章《对阵Flash 实战HTML 5技巧之页面布局》中我们给大家介绍了一个符合HTML5标准的网页的设计过程，在本篇文章中，我们紧接上一篇的内容，继续踏上HTML5之旅。
　　文章的评论区域
　　在文章后的读者评论区域中，我们使用的是sections标签，如下：
<section id="comments">
<h1> 3 Comments
<article class="comment">
<div class="comment-meta" id="comment-1">
<a href="" rel="external nofollow">Homer Simps on
<img src="" alt="" class="avatar"
/>
<time datetime="" pubdate>

<div class="comment-body">
<p>


<article class="comment">
<article class="comment">
<article class="comment">



　　在id为comments的section区域内，存放的是读者的所有评论，每一条评论都被设置放在内，在标签内，再使用div及相关样式进行了设置修饰。
　　页面的footer div部分
　　在评论区域后，是广告区域，这里我们设计一个大的div层，如下图：


　　其代码结构如下：
<div id="footer">
<aside class="sub-footer">
<h1>
<p>
<ul>
<li><a href="">
<li><a href="">
<li><a href="">
<li><a href="">


<aside class="sub-footer">
<h1>
<p>
<ul>
<li><a href="">
<li><a href="">
<li><a href="">
<li><a href="">


<aside class="advertising">
<h1>
<a href=""><img src="" alt=""
/>

详细说明：http://html5.662p.com/thread-52-1-1.html