工业和信息化精品系列教材-网页设计与制作(HTML5+CSS3+JavaScript)(第5版)(微课版)

本书系统全面地介绍网页制作和前端开发技术的基本理论和实际应用。全书共10章，从逻辑上可分为三大部分。前5章为第1部分，主要介绍网页制作的基本技术——HTML和CSS，同时介绍Photoshop在网页制作过程中的应用；第6章和第7章为第2部分，主要介绍CSS技术的高级应用技巧和JavaScript编程，并对各种常见的前端开发技术进行系统梳理；最后3章为第3部分，其中，第8章从心理学和设计理论视角介绍如何进行网页设计，第9章介绍如何使用Dreamweaver制作网页，第10章则从项目实践的角度介绍如何设计和开发网站，使读者能够在具体应用中巩固所学知识。 本书以实用为基本出发点，不仅包括各种网页制作和前端开发技术的基础理论，还强调了它们的具体应用，使读者既能打下坚实的理论基础，又能掌握实际的操作技能。本书绝大部分内容经过了长期的教学检验，重点突出、详略得当。本书可作为高等院校、成人高校和培训班的“网页制作”和“前端开发”等课程的教材或参考书，也适合广大网页设计爱好者或相关从业人员自学使用。

赵丰年，北京理工大学“我爱我师”评选十佳教师，软件学院“我最喜爱的教师”，北京理工大学“T-more优秀教师奖”一等奖，负责国家级精品课程2门，国家级教优秀学团队成员，主编北京市精品教材3部，国家级规划教材4部，研究方向：数字媒体技术、教育技术、游戏化（gamification）。成果：发表学术论文和教改论文多篇，获得国家级和省部级教学奖多项。

第 1章 HTML5 基础................... 1 1.1　什么是HTML .......................1 1.1.1　网页的基本概念........................　1 1.1.2　HTML 的工作原理....................　3 1.1.3　创建和测试网页........................　5 1.1.4　网页编辑工具............................　6 1.2　创建网页..............................7 1.2.1　标记符基础...............................　7 1.2.2　网页的基本结构........................　8 1.2.3　在网页中添加内容...................　12 1.3　综合实例：人物介绍网页........13 练习题　................................15 第　2章 文本格式与超链接............　16 2.1　设置文本格式......................16 2.1.1　段落格式................................　16 2.1.2　字体格式................................　19 2.1.3　列表格式................................　20 2.2　创建超链接.........................22 2.2.1　URL 概述...............................　22 2.2.2　页面链接................................　23 2.2.3　锚点链接................................　25 2.3　综合实例：唐诗宋词网站........27 2.3.1　网站规划................................　28 2.3.2　网页设计................................　29 2.3.3　网页制作................................　30 练习题　................................33 第3章　CSS3 基础....................　34 3.1　CSS 入门..........................34 3.1.1　什么是CSS ............................34 3.1.2　CSS 样式定义.........................35 3.1.3　CSS 的属性单位.....................36 3.2　在网页中使用CSS ..............37 3.2.1　使用站点样式..........................37 3.2.2　使用网页样式..........................39 3.2.3　使用行内样式..........................39 3.3　CSS3 基本选择器...............40 3.3.1　标记符选择器..........................40 3.3.2　类选择器.................................41 3.3.3　ID 选择器................................41 3.3.4　伪类选择器..............................42 3.3.5　群组选择器..............................43 3.4　CSS3 基础属性..................43 3.4.1　颜色与背景属性.......................43 3.4.2　字体属性.................................45 3.4.3　文本属性.................................47 3.5　综合实例：电影欣赏网站........48 3.5.1　网站规划与设计.......................49 3.5.2　网页制作.................................50 练习题　................................53 第4章　图像与多媒体..................　54 4.1　网页图像基础......................54 4.1.1　位图与矢量图..........................54 4.1.2　网页图像格式..........................55 4.1.3　使用网页图像的要点................56 4.2　图像处理基本操作................57 4.2.1　Photoshop 的界面..................57 4.2.2　修改图像的大小.......................58 4.2.3　调整图像的颜色.......................58 4.2.4　修补图像与抠像......................　59 4.2.5　用适当的格式保存图像.............　61 4.3　图像标记符img ...................62 4.3.1　插入图像................................　62 4.3.2　设置图像属性..........................　63 4.4　使用多媒体对象...................67 4.4.1　多媒体对象概述......................　67 4.4.2　插入多媒体对象......................　67 练习题　................................70 第5章　表格与表单.....................　72 5.1　创建表格............................72 5.1.1　表格的基本构成......................　72 5.1.2　合并单元格.............................　74 5.1.3　构造表格的步骤......................　74 5.2　表格的属性设置...................75 5.2.1　边框与分隔线..........................　75 5.2.2　控制单元格空白......................　76 5.2.3　表格的对齐.............................　78 5.3　创建表单............................80 5.3.1　什么是表单.............................　80 5.3.2　表单控件的类型......................　82 5.3.3　form 标记符............................　82 5.4　创建表单控件......................83 5.4.1　文本框与密码框......................　83 5.4.2　复选框与单选框......................　84 5.4.3　按钮.......................................　86 5.4.4　多行文本框.............................　87 5.4.5　选项菜单................................　88 5.5　综合实例：表格与表单...........89 5.5.1　复杂表格页面..........................　89 5.5.2　登录注册页面..........................　90 练习题　................................93 第6章　CSS3 进阶....................　95 6.1　CSS3 高级选择器................95 6.1.1　后代选择器..............................95 6.1.2　子元素选择器..........................97 6.1.3　相邻兄弟选择器.......................97 6.1.4　属性选择器..............................98 6.2　CSS3 布局........................99 6.2.1　CSS 盒模型............................99 6.2.2　CSS 定位概述.......................103 6.2.3　浮动定位...............................105 6.2.4　相对定位...............................107 6.2.5　绝对定位与固定定位...............108 6.3　CSS3 高级属性................　111 6.3.1　分类属性...............................111 6.3.2　列表属性...............................113 6.3.3　特效属性...............................115 6.4　CSS3 样式的优先级...........　118 6.4.1　一般性规则............................118 6.4.2　样式优先级的计算..................119 6.5　综合实例：中华美食网站......　122 6.5.1　网站规划与设计.....................123 6.5.2　网页制作...............................124 练习题　..............................　130 第7章　JavaScript 与前端开发技术..........131 7.1　使用客户端脚本.................　131 7.1.1　使用script 标记符.................131 7.1.2　直接添加脚本........................132 7.1.3　链接脚本文件........................132 7.2　JavaScript 编程...............　133 7.2.1　JavaScript 语言基础.............133 7.2.2　使用JavaScript 对象.............139 7.2.3　使用浏览器对象.....................144 7.2.4　使用HTML DOM 对象..........147 7.3　前端开发技术....................　159 7.3.1　使用jQuery ..........................159 7.3.2　使用Bootstrap.....................　164 7.3.3　使用Vue.js ..........................　172 7.3.4　使用AngularJS ...................　176 7.3.5　使用React...........................　179 练习题　..............................　180 第8章　网页设计基础................　182 8.1　设计与认知.......................　182 8.1.1　格式塔理论概述....................　182 8.1.2　认知时的组织原则.................　182 8.2　设计原则..........................　185 8.2.1　紧凑原则..............................　185 8.2.2　对齐原则..............................　187 8.2.3　重复原则..............................　189 8.2.4　对比原则..............................　190 8.3　设计适于扫描的网页............　191 8.3.1　建立清楚的视觉层次..............　192 8.3.2　使用习惯用法........................　193 8.3.3　划分明确的页面区域..............　194 8.3.4　减轻视觉污染........................　194 8.4　设计导航..........................　195 8.4.1　网页导航惯例........................　195 8.4.2　全局导航..............................　196 8.4.3　站点ID.................................　197 8.4.4　导航条..................................　198 8.4.5　实用工具..............................　198 8.4.6　返回主页..............................　198 8.4.7　搜索功能..............................　199 8.4.8　页面名称..............................　199 8.4.9　当前位置与面包屑.................　200 8.4.10　网站导航测试......................　202 8.5　设计版式..........................202 8.5.1　页面比例..............................　202 8.5.2　网页的分栏...........................　203 8.5.3　版面率..................................　205 8.5.4　图版面积..............................　206 8.5.5　跳跃率..................................　207 练习题　..............................　208 第9章　用Dreamweaver制作网页............　210 9.1　Dreamweaver 的界面.......　210 9.2　使用本地站点....................　211 9.2.1　创建本地站点........................211 9.2.2　站点文件操作........................213 9.3　编辑网页..........................　215 9.3.1　制作网页的一般过程..............215 9.3.2　使用文本...............................217 9.3.3　使用超链接............................218 9.3.4　使用图像...............................220 9.3.5　使用音频与视频.....................221 9.3.6　使用表格...............................222 9.3.7　使用表单...............................225 9.4　使用CSS 样式.................　227 9.4.1　创建CSS 样式表..................227 9.4.2　定义样式规则........................229 9.4.3　应用样式规则........................230 9.4.4　使用CSS 设计页面布局.........230 9.5　高级功能..........................　232 9.5.1　快速代码编写........................232 9.5.2　响应式网页设计.....................237 9.5.3　使用Bootstrap .....................243 9.5.4　使用jQuery ..........................248 练习题　..............................249 第　10章 综合项目实践................　251 10.1　网站开发的项目管理..........　251 10.1.1　网站开发流程......................251 10.1.2　网站开发团队......................253 10.1.3　网站策划书..........................254 10.2　“游戏天地”网站规划........256 10.2.1　网站目标............................　256 10.2.2　站点风格与技术因素............　256 10.2.3　信息架构............................　257 10.3　“游戏天地”网站设计.......257 10.3.1　导航设计............................　258 10.3.2　页面设计............................　259 10.4　“游戏天地”网站实现.......　261 10.4.1　实现流程............................　261 10.4.2　网页基本结构的实现............　262 10.4.3　典型页面的实现..................　265 练习题　..............................276 附录1　HTML 和CSS 颜色表...　278 附录2　HTML5 快速参考..........　280 附录3　CSS3 快速参考............　283