电子工业出版社-网上书店

本书以工业和信息化部教育与考试中心发布的《Web前端开发职业技能等级标准》（初级）为编写依据，帮助读者快速掌握HTML5+CSS3+JavaScript网页开发技能。内容包括HTML基础、HTML5新标签和属性、CSS3样式、JavaScript基础、移动端布局等，同时配备丰富的项目案例、课程文档、微课视频、案例实操视频和1+X初级考题精解、模拟题库等资源。本书采用项目导向、任务驱动的方式进行内容编排，语言通俗易懂，项目案例深入浅出，配套教学资源丰富。本书项目均源自企业真实项目，编写团队包括深耕本科教育数十年的教授及拥有丰富教学经验的高职院校一线教师，旨在为读者提供一个通俗易懂的技术学习平台。本书可作为高职高专、应用型本科院校和软件开发培训学校的Web前端开发技术初级课程的教材和实训指导书，亦可作为期望从事Web前端开发职业的应届毕业生和社会在职人员的自学参考书。

模块1  企业官网新闻中心模块设计	1
任务1　网页的认识与开发环境的搭建	2
【任务概述】	2
【知识准备】	2
【任务实施】	4
【任务拓展】	7
任务2　创建网站首页	7
【任务概述】	7
【知识准备】	7
【任务实施】	10
【任务拓展】	11
任务3　新闻详情页设计	11
【任务概述】	11
【知识准备】	11
【任务实施】	16
【任务拓展】	19
任务4　新闻列表页设计	19
【任务概述】	19
【知识准备】	19
【任务实施】	21
【任务拓展】	24
【练习与思考】	24
模块2  企业年度业绩报表页面设计	26
任务　“巨巨网络科技有限公司年度业绩报表”页面设计	27
【任务概述】	27
【知识准备】	27
【任务实施】	38
【任务拓展】	43
【练习与思考】	43
模块3  新闻中心模块样式美化	45
任务1　新闻详情页的外部样式表配置	46
【任务概述】	46
【知识准备】	46
【任务实施】	48
【任务拓展】	48
任务2　新闻详情页的样式美化	48
【任务概述】	48
【知识准备】	49
【任务实施】	62
【任务拓展】	64
任务3　新闻列表页的样式美化	64
【任务概述】	64
【知识准备】	65
【任务实施】	67
【任务拓展】	68
【练习与思考】	69
模块4  “加入我们”页面设计	71
任务　“加入我们”页面的布局与样式设计	72
【任务概述】	72
【知识准备】	72
【任务实施】	87
【任务拓展】	96
【练习与思考】	97
模块5  “产品中心”页面设计	99
任务　“产品中心”页面的布局与样式设计	100
【任务概述】	100
【知识准备】	100
【任务实施】	113
【任务拓展】	126
【练习与思考】	126
模块6  企业官网首页设计	128
任务1　企业官网首页结构搭建	129
【任务概述】	129
【知识准备】	129
【任务实施】	137
【任务拓展】	139
任务2　企业官网首页导航栏与底部栏设计	139
【任务概述】	139
【知识准备】	140
【任务实施】	147
【任务拓展】	151
【练习与思考】	152
模块7  企业官网首页广告栏设计	153
任务　企业官网首页广告栏的布局与切换效果设计	154
【任务概述】	154
【知识准备】	154
【任务实施】	160
【任务拓展】	167
【练习与思考】	167
模块8  企业官网首页广告栏动画设计	169
任务1　广告图切换效果设计	170
【任务概述】	170
【知识准备】	170
【任务实施】	178
【任务拓展】	179
任务2　广告图动画效果设计	180
【任务概述】	180
【知识准备】	180
【任务实施】	185
【任务拓展】	186
【练习与思考】	187
模块9  “关于我们”模块设计	188
任务　“关于我们”模块的布局与样式设计	189
【任务概述】	189
【知识准备】	189
【任务实施】	204
【任务拓展】	211
【练习与思考】	212
模块10  移动端网页设计	213
任务1　移动端宣传页设计	214
【任务概述】	214
【知识准备】	214
【任务实施】	220
【任务拓展】	224
任务2　移动端首页设计	224
【任务概述】	224
【知识准备】	224
【任务实施】	228
【任务拓展】	233
【练习与思考】	233
模块11  网页交互功能设计	235
任务1　JavaScript入门	236
【任务概述】	236
【知识准备】	236
【任务实施】	247
【任务拓展】	248
任务2　轮播图设计	248
【任务概述】	248
【知识准备】	249
【任务实施】	252
【任务拓展】	255
【练习与思考】	255

在前端开发技术的学习中，HTML5、CSS3和JavaScript是基础技术，因此熟练掌握HTML5、CSS3和JavaScript技术是学习前端开发技术的第一步。
本书以“巨巨网络科技有限公司”网站项目为导向，并将该项目分解成若干能够实现阶段成果的任务，对HTML5、CSS3和JavaScript的知识进行了详细介绍和应用举例。全书共有11个模块，具体介绍如下。
模块1为企业官网新闻中心模块设计，该模块将设计“巨巨网络科技有限公司官网新闻中心”模板。通过该模块的学习，读者可以了解常见网页名词、HTML结构和常用标签，并掌握开发工具的安装和使用方法，通过软件进行简单图文混排页面的布局设计。
模块2为企业年度业绩报表页面设计，该模块将通过HTML表格技术完成“巨巨网络科技有限公司年度业绩报表”页面的设计。通过该模块的学习，读者可以掌握HTML中表格的使用方法，熟悉表格的行列属性及合并、拆分、嵌套等操作，并能够设计常见的数据表格。
模块3为新闻中心模块样式美化，该模块将美化“巨巨网络科技有限公司官网新闻中心”模块的样式。通过该模块的学习，读者可以掌握CSS使用基础，以及CSS选择器和样式属性的使用方法，能够正确引用CSS样式对文本样式进行美化。
模块4为“加入我们”页面设计，该模块将完成“加入我们”页面的布局与样式设计。通过该模块的学习，读者可以掌握表单、表单元素和CSS3选择器的使用方法。
模块5为“产品中心”页面设计，该模块将完成“产品中心”页面的布局与样式设计。通过该模块的学习，读者可以掌握盒模型、浮动、精灵图的使用方法。
模块6为企业官网首页设计，该模块将完成企业官网首页的结构搭建，以及导航栏与底部栏的设计。通过该模块的学习，读者可以掌握HTML5新增的语义化标签，以及CSS3新增的渐变、阴影和滤镜等属性的使用方法。
模块7为企业官网首页广告栏设计，该模块将完成企业官网首页广告栏的布局与切换效果设计。通过该模块的学习，读者可以掌握盒模型固定定位、相对定位和绝对定位的使用方法，并能够根据不同定位的属性，选择合理的定位方式进行页面布局设计。
模块8为企业官网首页广告栏动画设计，该模块将完成企业官网首页广告栏的交互动画设计。通过该模块的学习，读者可以掌握CSS属性过渡与动画设计，并能够根据设计需求进行流畅的CSS动画设计。
模块9为“关于我们”模块设计，该模块将完成企业官网首页中“关于我们”模块的布局与样式设计。通过该模块的学习，读者可以掌握HTML5多媒体标签的使用方法，以及SVG图形和Canvas的相关知识，并能够通过HTML5多媒体标签、SVG图形和Canvas进行更丰富的多媒体网页设计。
模块10为移动端网页设计，该模块将完成移动端宣传页和首页的设计。通过该模块的学习，读者可以掌握视口、相对长度单位、flex布局等移动端网页开发知识，并能够合理应用相对长度单位和flex布局进行移动端网页设计。
模块11为网页交互功能设计，该模块将完成企业网页中轮播图的设计。通过该模块的学习，读者可以掌握JavaScript的基础语法和DOM对象操作，并能够进行简单的网页交互设计。
本书的编写特点如下。
（1）本书采用项目导向、任务驱动的方式进行内容编排，将基础知识与项目实战紧密结合，易于读者理解抽象的知识内容，并将其应用于实战中。
（2）本书知识点覆盖全面，涉及HTML、HTML5、CSS3、JavaScript等基础知识，大部分知识点有详细说明和案例示范，并采用完整项目串联章节知识，帮助读者打下坚实的网页开发基础。
（3）本书配备了丰富的项目案例、课程文档、微课视频、案例实操视频等资源。
（4）本书配套1+X初级考题精解、模拟题库，方便读者进行考前训练。
（5）本书的合作编写企业还提供了独创的在线AI实训平台，能够让读者在线实践知识点内容，并通过AI实验帮手逐步实现复杂的企业化项目。该平台真正实现了学习、实践、测评一体化，还支持学情分析功能，便于教师通过平台掌握学生的学习进度、知识薄弱点等数据，更好地改进教学质量。
本书编写人员有来自教学第一线的，也有来自企业第一线的。教学项目的设计由福建巨巨网络科技有限公司的吴森宏工程师完成。编写分工如下。
福州外语外贸学院袁晓建老师负责模块1～模块5的编写及全书的统稿工作，广东工程职业技术学院的陆晓梅老师负责模块6和模块7的编写，福州职业技术学院的郑若鹢老师负责模块8和模块9的编写，福州职业技术学院的王琳燕老师负责模块10和模块11的编写。
由于编者的水平有限，书中难免存在疏漏之处，恳请读者批评、指正，万分感谢。
编  者

本书配套资源下载

对不起，暂无音视频资源！

HTML5+CSS3+JavaScript网页开发实战