本书集HTML5、CSS3、JavaScript技术于一体，基于Web标准，详细介绍了Web前端设计技术的基础知识，对Web体系结构、HTML5、CSS3、JavaScript和网站制作流程进行了详细的讲解；为了使广大的Web开发者真正了解与全面掌握HTML5、CSS3、JavaScript等技术，本书对HTML5和CSS3样式布局进行了深入的介绍，同时介绍了使用JavaScript脚本语言实现网页动态效果。书中引入了丰富的案例，对案例进行了细致的分析，便于学生理解所学知识，加强实操训练，提高实践能力。本书结构合理、内容紧凑，每个知识点都精心设计了案例。本书既适合作为高职院校计算机专业程序设计课程的教材，也适合Web前端和对HTML5及未来Web应用技术感兴趣的读者参考。

HTML5、CSS3、JavaScript技术是网页设计的精髓。当今时代，网络应用正处在不断变革中，而作为与应用密切相关的前端技术更是备受瞩目。其中，以HTML5为代表的新一代技术尤为受到多方的关注，因为HTML5不仅仅是一次简单的技术升级，更代表了未来Web开发的方向，对于当今整个Web开发领域来说，HTML5可谓最热门的话题之一，被寄予了太多的期望与依托。在Web开发中采用CSS技术可以显著地美化应用程序，有效地控制页面的布局、字体、颜色、背景和其他效果。利用好CSS还可以更快捷地得到以往要用很多插件才能达到的效果。 HTML5相较于HTML4做出了一定程度的修改。这些修改包括一些标签的增加或删减、语法结构的简化等。与Flash相比，HTML5的优点是无须插件、对搜索引擎友好，且在性能与稳定性方面的表现更优。HTML5的框架在原版本的基础上，废除了许多HTML4中不合理的效果标记，创造性地增加了很多用于富媒体、富图形的新标记，最大限度地减少了对外部插件的依赖；本书第2章介绍了许多新增加的元素属性，需要借助相关的书籍来引导开发者进行学习，使其快速掌握HTML5。 本书共14章，内容包括： 第1章 HTML5概述，介绍HTML5的基础知识，帮助大家了解HTML的轮廓和发展历程，并介绍HTML5页面的创建方法。 第2章 全新的HTML5，详细介绍了HTML5中新增的结构元素，还增加了一些表示逻辑结构或附加信息的非主体结构元素、新增的属性及其用法，以及HTML5中废除的元素。 第3章 认识HTML5的文档结构，介绍了Web标准、HTML5的基本结构，帮助大家了解HTML5的轮廓，并通过一个实例介绍符合Web标准的HTML5文档结构。 第4章 网页文本设计，通过实例介绍网页中文本的插入和文本的斜体、粗体等特殊样式的知识，讲解文档排版的段落标记和标题标记，以及使用标记创建无序列表、有序列表和自定义列表。 第5章 美化网页—— 使用CSS3技术，详细介绍CSS3的基本概念、定义和使用语法，介绍层叠样式表文件的使用语法规则、定义方式、在网页中的引用方法，CSS构造样式的规则及样式选择器的类型。 第6章 文本格式的高级设置，详细介绍CSS3中文本样式表的高级设置，通过实例对文本样式中的文本字体、风格、字号、大小写转换、行间距、字间距、溢出处理等常用文本样式属性进行讲解。 第7章 网页色彩和图片设计，介绍网页中的色彩和图片的关系，以及图像的应用。 第8章 网页超链接设计，通过实例讲解网页超链接设计的相关知识，包括创建超文本/ 图片链接、下载链接，使用绝对/相对路径、在不同窗口打开链接，使用超文本链接发送电子邮件，使用锚点制作电子书阅读网页，创建热点区域及浮动框架。 第9章 用HTML5创建表格，介绍页面中表格的各种HTML标签，如表格标签＜table＞、行标签＜tr＞、单元格标签＜td＞、标题标签＜caption＞等，以及跨行跨列的处理方法和分组设置表格列样式的处理方法。 第10章 网页表单设计，主要介绍表单的基本标签，如表单＜form＞、输入＜input＞、下拉列表＜select＞、多行文本＜textarea＞等和表单的工作原理。 第11章　网页多媒体设计，学习在HTML5中增加audio和video进行多媒体播放的方法。通过audio或video的属性能够获取多媒体播放的进度、总时间等信息，通过自定义播放器可以设置播放器的播放、暂停、音量调整等动作。 第12章　HTML5布局，介绍关于页面布局的一系列基础知识和一些布局案例，它们基本涵盖了当前的主流布局方式，具有很强的代表性。 第13章　使用JavaScript脚本语言实现网页动态效果，主要介绍JavaScript的基本语法、常用内置对象、文档对象模型、用户验证等知识。 第14章　网页设计与开发综合范例，通过实例讲解网页规划、结构、布局的相关知识，最后通过一个综合实例介绍网页设计与开发的过程。 本书注重理论结合实际，注重基本知识的传授与基本技能的培养，适合作为高职院校计算机专业HTML5+CSS3+JavaScript的教学用书。 本书由罗保山、孙琳担任主编，张松慧、赵丙秀、张克斌担任副主编，参加编写的人员还有董宁、江平、汪晓青、刘波等。本书在编写过程中参考了许多资料和国内外的优秀教材，在此对其作者一并表示衷心的感谢。 为了方便教师教学，本书提供了教学参考资料包，内容包括电子课件、案例源代码、课后上机实训、习题解答等，请有此需要的教师登录华信教育资源网（www.hxedu.com.cn）注册后免费下载，如有问题可在网站留言板留言或与电子工业出版社联系（E-mail：hxedu@phei.com.cn）。 由于编写时间紧张，编者水平有限，书中难免存在疏漏，敬请读者批评指正。 编 者

第1章 HTML5概述 1 1.1 HTML简介 1 1.2 了解HTML5 2 1.3 搭建HTML5的开发环境 4 1.4 HTML5文件的编写方法 4 1.4.1　使用记事本手工编写HTML5文件 4 1.4.2　使用Dreamweaver CS编写HTML 文件 6 1.4.3　实例：编写第一个HTML5网页 文件 7 1.4.4 预览HTML5网页 8 本章小结 8 练习与实训 8 第2章 全新的HTML5 9 2.1　HTML5的适用范围 9 2.1.1 HTML5与各大浏览器的兼容性 9 2.1.2 运用＜video＞和＜audio＞标签进行 视频和音频制作 9 2.1.3 更炫酷的界面 10 2.1.4 更强大的表单功能 10 2.1.5 提升可访问性 10 2.2 语法变化 10 2.2.1 HTML5的语法变化 10 2.2.2 HTML5中的标记方法 11 2.2.3 HTML5与之前版本的兼容性 12 2.3 HTML5新增和废除的元素 13 2.3.1 新增的结构元素 13 2.3.2 新增的其他元素 14 2.3.3 废除的元素 15 2.4 新增的属性 16 2.5 全局属性 17 2.5.1 hidden属性 18 2.5.2 spellcheck属性 18 2.5.3 contenteditable属性 18 2.5.4 designmode属性 19 2.5.5 tabindex属性 19 本章小结 19 练习与实训 19 第3章 认识HTML5的文档结构 20 3.1 Web标准 20 3.1.1　Web标准概述 20 3.1.2　Web标准规定的内容 20 3.2 HTML5的基本结构 21 3.2.1 文档类型标记doctype 21 3.2.2　html标记 21 3.2.3　头标记head 21 3.2.4 主体标记body 22 3.2.5　标题标记title 22 3.2.6　元信息标记meta 22 3.2.7　页面注释标记 24 3.3　综合实例——符合W3C标准的HTML5 网页 24 3.3.1 HTML 26 3.3.2　CSS 27 3.3.3　JavaScript 27 3.4 HTML5页面构成 28 3.4.1 HTML5页面主要组成部分 28 3.4.2 综合实例——HTML5页面构成 29 本章小结 36 练习与实训 36 第4章 网页文本设计 37 4.1　添加文本 37 4.1.1 普通文本 37 4.1.2 特殊字符文本 37 4.1.3 文本特殊样式 38 4.2 文本排版 41 4.2.1 段落标记 41 4.2.2 标题标记 43 4.2.3 center标记 44 4.2.4 hr标记 45 4.2.5 span标记 46 4.2.6 特殊信息文本 47 4.3 网页文字列表设计 52 4.3.1　建立无序列表 52 4.3.2　建立有序列表 54 4.3.3　建立自定义列表 55 本章小结 56 练习与实训 56 第5章 美化网页——使用CSS3技术 57 5.1　CSS3概述 57 5.2　CSS3基本选择器 57 5.2.1　标记选择器 58 5.2.2　类选择器 58 5.2.3　ID选择器 59 5.3　在HTML5中使用CSS3的方法 60 5.3.1　行内样式 60 5.3.2　嵌入样式 60 5.3.3　链接样式 61 5.3.4　导入样式 62 5.3.5　样式的优先级 62 5.4　CSS3复合选择器 64 5.4.1　交集选择器 64 5.4.2　并集选择器 64 5.4.3　后代选择器 65 5.4.4　子选择器 66 5.4.5　相邻选择器 67 5.4.6 伪类选择器 67 5.4.7　伪对象选择器 68 5.5 CSS3常用效果与技巧 69 5.5.1 阴影效果 70 5.5.2 2D与3D效果 71 本章小结 75 练习与实训 75 第6章 文本格式的高级设置 76 6.1　文本样式 76 6.1.1　字体 76 6.1.2　字号 77 6.1.3　字体风格 78 6.1.4　加粗字体 78 6.1.5　小写字母转为大写字母 78 6.1.6　字体复合属性 79 6.1.7　字体颜色 79 6.1.8　溢出文本 80 6.1.9 控制换行 81 6.2 文本样式 81 6.2.1　单词间隔 81 6.2.2　字符间隔 82 6.2.3　文字修饰 82 6.2.4　垂直对齐方式 83 6.2.5　水平对齐方式 84 6.2.6　文本缩进 84 6.2.7　文本行高 85 6.2.8　处理空白 85 6.2.9　文本反排 86 6.3　CSS3设置文本样式 87 6.4　综合实例—— 用CSS3设计网站侧边导 航栏 88 本章小结 92 练习与实训 92 第7章 网页色彩和图片设计 93 7.1 网页色彩和图片的关系 93 7.2　网页图像的应用 94 7.2.1 网页图片格式的选择 94 7.2.2　路径表示法 96 7.2.3　图片的使用 97 7.3　用CSS3设置颜色与背景 98 7.3.1　用CSS3设置图像效果 100 7.3.2　图片缩放 101 本章小结 103 练习与实训 103 第8章 网页超链接设计 104 8.1　创建超文本与图片链接 104 8.2　创建下载链接 105 8.3　使用相对路径和绝对路径 106 8.4　设置链接目标打开窗口 107 8.5　超文本链接到一个E-mail地址 108 8.6　使用锚链接制作电子书阅读网页 110 8.7　创建热点区域 112 8.8　浮动框架 113 8.9 综合实例——图片热点区域制作 114 本章小结 118 练习与实训 118 第9章 用HTML5创建表格 119 9.1　创建表格 119 9.1.1 创建表格的基本语法——table 元素、tr元素、th元素、td元素 119 9.1.2 表格的描述——summary属性 121 9.2 表格的标题——caption元素 122 9.3 设置单元格——th元素、td元素 122 9.3.1 使用th元素和td元素定义单元格 122 9.3.2 跨多行、多列的单元格 124 9.4 表格的按行分组显示——thead元素、 tfoot元素、tbody元素 127 9.5 表格的按列分组显示——colgroup 元素、col元素 128 本章小结 130 练习与实训 130 第10章 网页表单设计 131 10.1　熟悉表单属性 131 10.1.1 表单的用途 131 10.1.2 表单的属性设置 132 10.2 基本元素的应用 134 10.2.1 文本框 137 10.2.2 密码域 138 10.2.3 单选框 138 10.2.4 复选框 139 10.2.5 普通按钮 140 10.2.6 提交按钮 141 10.2.7 重置按钮 141 10.2.8 多行文本框textarea 141 10.2.9 label标签 142 10.2.10 下拉列表框 143 10.2.11 其他基本元素 144 10.3 表单高级元素的使用 145 10.3.1 url类型元素 145 10.3.2 email类型元素 146 10.3.3 number类型元素 146 10.3.4 range类型元素 147 10.3.5 search类型元素 148 10.3.6 color类型元素 149 10.3.7 日期和时间元素 149 10.3.8 datalist标签 150 10.3.9 input表单控件新增属性 151 10.4 综合实例——创建用户反馈表单 153 本章小结 160 练习与实训 160 第11章 网页多媒体设计 162 11.1　HTML5 audio元素和video元素概述 162 11.1.1 视频容器 162 11.1.2 音频和视频编解码器 162 11.1.3 audio元素和video元素的src 属性和source属性 164 11.2　网页中的音频文件 165 11.2.1 audio元素的浏览器支持情况 165 11.2.2 添加自动播放音频文件（autoplay 属性） 165 11.2.3 添加带有控件的音频文件 （controls属性） 166 11.2.4 添加循环播放音频文件 （loop属性） 167 11.2.5 添加预播放的音频文件 （preload属性） 167 11.3　网页中的视频文件 168 11.3.1 video元素的浏览器支持情况 168 11.3.2 添加带有控件的视频文件 （controls属性） 169 11.3.3 添加自动播放的视频文件 （autoplay属性） 171 11.3.4 添加循环播放的视频文件（loop 属性） 172 11.3.5 添加预播放的视频文件（preload 属性） 173 11.3.6 设置视频文件的宽度和高度 （width与height属性） 174 11.3.7 设置视频文件的error属性 175 11.3.8 设置视频文件的networkState 属性（只读属性） 176 11.3.9 视频文件的readyState属性 176 11.4　多媒体元素常用方法和事件简述 176 11.5 综合实例 —— 使用多媒体元素播放 文件 177 本章小结 178 练习与实训 178 第12章 HTML5布局 179 12.1 布局简介 179 12.1.1 页面元素与布局核心技巧 179 12.1.2 元素显示方式 179 12.2 图文混排与题图文字布局 180 12.2.1 图文混排布局 180 12.2.2 题图文字布局 181 12.3 float多栏布局 182 12.3.1 float浮动 183 12.3.2 清除浮动clear 185 12.3.3 float两列均分布局 186 12.3.4 float多栏布局 191 12.4 盒布局与弹性盒布局 197 12.4.1 盒布局 197 12.4.2 弹性盒布局 199 12.5 position定位 205 12.5.1 position 205 12.5.2 z-index 207 12.5.3 clip 208 本章小结 209 练习与实训 209 第13章 使用JavaScript脚本语言实现网页 动态效果 210 13.1　JavaScript简介 210 13.1.1　JavaScript的概念和特点 210 13.1.2　JavaScript与Java 211 13.1.3　第一个JavaScript程序 212 13.2　在html文档中使用脚本代码 215 13.2.1 内部引用JavaScript 216 13.2.2 外部引用JavaScript 216 13.2.3 内联引用JavaScript 217 13.3　JavaScript语言基础 218 13.3.1　JavaScript语法格式 218 13.3.2　JavaScript语句 218 13.3.3　JavaScript注释 219 13.3.4　数据类型 220 13.3.5　常量 220 13.3.6　变量 221 13.4　表达式与运算符 222 13.4.1　表达式 222 13.4.2　运算符 222 13.5　JavaScript控制结构与函数 224 13.5.1　JavaScript控制结构 224 13.5.2　函数 233 13.6 事件驱动及事件处理 237 13.7　对象编程 239 13.7.1 内置对象 239 13.7.2 文档对象编程 248 13.8　综合实例——实现即时验证效果 254 本章小结 259 练习与实训 259 第14章 网页设计与开发综合范例 260 14.1　网页内容分析 260 14.2　综合实例——制作门户类网页 261 14.2.1 网页框架构建及素材的准备 261 14.2.2 建立本地站点 262 14.2.3 使用HTML创建页面结构 263 14.2.4 使用CSS布局并美化页面 265 本章小结 271 练习与实训 271 参考文献 272

罗保山，副教授，武汉软件工程职业学院计算机学院副院长，毕业于华中师范大学计算机软件专业，现任教于计算机学院物联网技术教研室。从事计算机教学20年，主讲《HTML与CSS程序设计》、《数据库技术》、《C#高级程序设计》等课程。主、参编教材11本，公开发表论文13篇，主持或参与市级以上科研课题20余项，取得软件著作权、专利7项。

http://www.hxedu.com.cn/hxedu/fg/book/bookinfo.html?code=G0323180