葛蓝

摘要：随着互联网产业的高速发展，如今HTML5和CSS3已成为主流的Web前端开发技术，与以往版本相比，HTML5新元素及其特性HTML5的语义化标签以及属性，可以让开发者非常方便地实现清晰的web页面布局，加上CSS3的效果渲染，快速建立丰富灵活的web页面显得非常简单。本文以一个简单的鲜花网站首页为例，介绍基于Html5+CSS布局的网页。

关键词：HTML5；CSS；网页布局

中图分类号：TP273 文献标识码：A 文章编号：1007-9416（2017）10-0092-02

随着互联网产业的高速发展，HTML超文本标记语言作为构建web世界的基础语言，也经历了数次发展。2014年10月29日，万维网联盟宣布，经过接近8年的艰苦努力，HTML5标准规范终于制定完成。如今HTML5和CSS3已成为主流的Web前端开发技术，与以往版本相比它具有许多新特性，例如，HTML5引入非常多的描述性标签来创建更好的页面结构，例如用于定义头部的header标签、定义尾部的footer标签、定义导航的nav标签、定义侧边栏aside标签等，HTML5新元素及其特性HTML5的语义化标签以及属性，可以让开发者非常方便地实现清晰的web页面布局，加上CSS3的效果渲染，快速建立丰富灵活的web页面显得非常简单。

本文以一个简单的鲜花网站首页为例，介绍基于Html5+CSS布局的网页。

1 Html5布局页面

1.1 HTML5的文档声明，新建index.html文件，生成如下的HTML5模板

（1）<！DOCTYPE html>；（2）；（3）；（4）；（5）；（6） ；（7）；（8）；（9） 1.2 头部标签的实现

/*在网页头部放入Logo*/

同一个页面中可以包含多个