《HTML5开发手册》——1.11　高级“菜谱”：使用所有新标记建立新闻页面

1.11　高级“菜谱”：使用所有新标记建立新闻页面

图1.13和代码1.13所示为如何使用所有的HTML5新元素来建立一个新闻页面的布局。示例中使用了一些基本的CSS来定义元素的位置。阅读完后面的章节，我们能使这个页面更漂亮。

代码1.13　创建一个新闻主页

https://yqfile.alicdn.com/ab47bea9d3547ee7e9695509c72dbbfa5cbd3e55.png" >

在编辑好一个基本的布局和代码后，让我们检查一下文档大纲。前面的代码会产生如下的大纲：

1．Loads of News

　a．Untitled NAV

2．Headline article

　a．This is our most important article

3．Sports news

　a．Sports headline 1

　b．Sports headline 2

　c．Sports headline 3

4．Entertainment news

　a．Entertainment headline 1

　b．Entertainment headline 2

　c．Entertainment headline 3

5．Nerdy news

　a．Nerdy headline 1

　b．Nerdy headline 2

　c．Nerdy headline 3

6．Untitled ASIDE

这看上去很优美。footer元素与section、article、nav和aside不同，不是分栏内容（sectioning content），所以不会显示在大纲中。nav和aside中没有标题，这也不要紧。当然也可以给aside一个标题，不过嵌入的广告可不会保证有标题。