1、细说网页制作 图 7.7火焰文字效果 图 7.6文字光晕效果 图 7.5文字层叠效果 图 7.4文字双层阴影彩图总汇 图7.61自定义线性渐变（2）图7.60自定义线性渐变（1）图 7.59多色线性渐变细说网页制作 图 7.66自定义半径及圆心位置的径向渐变 图 7.65自定义半径的径向渐变 图 7.64圆形渐变 图 7.63简单径向渐变彩图总汇 图 10.10七色板示意图 图 7.67三色重复的径向渐变 细说网页制作 兄弟连教育组编 高洛峰 李明霞 王宝龙编著 内 容 简 介 通过本书的学习，能快速上手网站前端开发。为了使 HTML5 语言能被读者更好地掌握和应用，同时作为“跟兄弟连学 HT
2、ML5 系列教程”的第一本入门级图书，本书对 HTML 语言的知识点进行了详细的阐述和分析，包括 HTML5 和 CSS3 的语法、各种页面布局方法、流行的前端框架 Bootstrap 等内容。书中不仅有通俗易懂的语法讲解，也用贴切的小案例实验，使读者能轻松掌握新知识，且可以快速上手前端技术操作。本书适合对前端技术开发感兴趣的初学者阅读，也可以作为从事前端技术工作的开发人员的参考书，或作为大学生学习 HTML5 的教材。同时，本书也为读者之后学习同系列其他图书奠定了基础。未经许可，不得以任何方式复制或抄袭本书之部分或全部内容。版权所有，侵权必究。图书在版编目（CIP）数据 细说网页制作/兄弟连
3、教育组编；高洛峰，李明霞，王宝龙编著.北京：电子工业出版社，2017.11 ISBN 978-7-121-32875-6.细.兄 高 李 王.网页制作工具高等学校教材.TP393.092.2 中国版本图书馆 CIP 数据核字（2017）第 247282 号 策划编辑：李 冰 责任编辑：李 冰 特约编辑：赵海红 赵海军等 印 刷：三河市鑫金马印装有限公司 装 订：三河市鑫金马印装有限公司 出版发行：电子工业出版社 北京市海淀区万寿路 173 信箱 邮编：100036 开 本：7871092 1/16 印张：25.5 字数：659.2 千字 彩插：2 版 次：2017 年 11 月第 1 版 印
4、次：2017 年 11 月第 1 次印刷 定 价：59.80 元 凡所购买电子工业出版社图书有缺损问题，请向购买书店调换。若书店售缺，请与本社发行部联系，联系及邮购电话：（010）88254888，88258888。质量投诉请发邮件至 ，盗版侵权举报请发邮件至 。本书咨询联系方式：。前言 PREFACE 随着 HTML5 标准化逐渐成熟，以及互联网的飞速发展和移动端的应用不断创新，再加上微信公众号、小程序的应用飙升，原生 APP 向 Web APP 和混合 APP 的转变，用户对视觉效果和操作体验的要求越来越高，HTML5 成为移动互联网的主要技术，也是目前的主流技术之一。HTML5 是超文本
5、标记语言（HTML）的第 5 次修订，是近年来 Web 标准的巨大飞跃。Web 是一个内涵极为丰富的平台，和以前版本不同的是，HTML5 并非仅仅用来表示Web 内容，在这个平台上还能非常方便地加入视频、音频、图像、动画，以及与计算机的交互。HTML5 的意义在于它带来了一个无缝的网络，无论是 PC、平板电脑，还是智能手机，都能非常方便地浏览基于 HTML5 的各类网站。对用户来说，手机上的 APP 会越来越少，用HTML5 实现的一些应用不需要下载安装，就能立即在手机界面中生成一个 APP 图标，使用手机中的浏览器来运行，新增的导航标签也能更好地帮助小屏幕设备和有视力障碍人士使用。HTML5
6、 拥有服务器推送技术，给用户带来了更便捷的实时聊天功能和更快速的网游体验。HTML5 对于开发者来说更是福音。HTML5 本身是由 W3C 推荐的，也就意味着每一个浏览器或每一个平台都可以实现，这样可以节省开发者花在浏览器页面展现兼容性上的时间。另外，HTML5 是 Web 前端技术的一个代名词，其核心技术点还是 JavaScript。如 HTML5的服务器推送技术再结合 JavaScript 编程，能够帮助我们实现服务器将数据“推送”到客户端的功能，客户端与服务器之间的数据传输将更加高效。基于 SVG、Canvas、WebGL 及 CSS3的 3D 功能，会让用户惊叹在浏览器中所呈现的各种炫
7、酷的视觉效果。以往在 iPhone iPad 上不支持的 Flash 将来都有可能通过 HTML5 华丽地呈现在用户的 iOS 设备上。本套图书介绍 为了让前端技术初学者少走弯路，快速而轻松地学习 HTML5 和 JavaScript 编程，我们结合新技术和兄弟连多年的教学经验积累，再通过对企业实际应用的调研，编写了一整套HTML5 系列图书，共 5 本，包括细说网页制作、细说 JavaScript 语言、细说 DOM 编程、细说 AJAX 与 jQuery和细说 HTML5 高级 API。每一本书都是不同层次的完整 IV 细说网页制作 内容，不仅给初学者安排了循序渐进的学习过程，也便于不同层
8、次的读者选择；既适合没有编程基础的前端技术初学者作为入门教程，也适合正在从事前端开发的人员作为技术提升参考资料。本套图书编写的初衷是为了紧跟新技术和兄弟连 IT 教育 HTML5 学科的教学发展，作为本校培训教程使用，也可作为大、中专院校和其他培训学校的教材。同时，对于前端开发爱好者，本书也有较高的参考价值。细说网页制作 作为“跟兄弟连学 HTML5 系列教程”的第一本书，主要带领 HTML5 初学者一步步完成精美的页面制作。本书内容包括 HTML 应用、CSS 应用、HTML5 的新技术、各种主流的页面布局方法和一整套页面开发实战技能，让读者可以使用多种方法完成 PC 端的页面制作、移动端的
9、页面制作，以及响应式布局页面的制作，不仅能做出页面，还能掌握如何做好页面。细说JavaScript语言 这是“跟兄弟连学 HTML5 系列教程”的第二本书，在学习本书之前需要简单了解一下第一本书中的 HTML 和 CSS 内容。本书内容是纯 JavaScript 语言部分，和浏览器无关，包括 JavaScript 基本语法、数据类型、流程控制、函数、对象、数组和内置对象，所有知识点都是为了学习 DOM 编程、Node.js、JS 框架等 JavaScript 高级部分做准备。本书虽然是JavaScript 的基础部分，但全书内容都需要牢牢掌握，才能更好地晋级学习。细说DOM编程 这是“跟兄弟连
10、学 HTML5 系列教程”的第三本书，全书内容都和浏览器相关，在学习本书之前需要掌握前两本书的技术。本书内容包括 BOM 和 DOM 两个关键技术点，并且全部以 PC 端和移动端的 Web 特效为主线，以实例贯穿全部知识点进行讲解。学完本书的内容，不仅可以用 JavaScript 原生的语法完成页面的特效编写，也为学习后面的 JavaScript 框架课程做好了准备。本书内容是 Web 前端课程的核心，需要读者按书中的实例多加练习，能熟练地进行浏览器中各种特效程序的开发。细说AJAX与jQuery 这是“跟兄弟连学 HTML5 系列教程”的第四本书，其内容是建立在第三本书之上的，包括服务器端开
11、发语言 Node.js、异步传输 AJAX 和 jQuery 框架三部分。其中，Node.js 部分是为了配合 AJAX 完成客户端向服务器端的异步请求；jQuery 是目前主流的前端开发框架，前言 V 其目的是让开发者用尽量少的代码完成尽可能多的功能。AJAX 和 jQuery 是目前前端开发的必备技术，本书从基本应用开始学起，用实例分解方式讲解技术点，让读者完全掌握这些必备的技能。细说HTML5 高级API 这是“跟兄弟连学 HTML5 系列教程”的第五本书，是前端开发的应用部分，主要讲解HTML5 高级 API 的相关内容，包括画布、Web 存储、应用缓存、服务器发送事件等，可以用来开发
12、移动端的 Web APP 项目。本书重点讲解了 Cordova 技术，它提供了一组与设备相关的 API，通过这组 API，移动应用就能够通过 JavaScript 访问原生的设备功能，如摄像头、麦克风等。Cordova 还提供了一组统一的 JavaScript 类库，以及与这些类库所用的设备相关的原生后台代码。通过编写 HTML5 程序，再用 Cordova 打包出混合 APP 的项目，可以安装在 Android 和 iOS 等设备上。本套图书的特点 1内容丰富，由浅入深 本套图书在内容组织上本着“起点低，重点高”的原则，内容几乎涵盖前端开发的所有核心技能，对于某一方面的介绍再从多角度进行延伸
13、。为了让读者更加方便地学习本套图书的内容，在每本书的每个章节中都提供了一些实际的项目案例，便于读者在实践中学习。2结构清晰，讲解到位 每个章节都环环相扣，为了让初学者更快地上手，本套图书精心设计了学习方式。对于概念的讲解，都是先用准确的语言总结概括，再用直观的图示演示过程，接着以详细的注释解释代码，最后用形象的比喻帮助记忆。对于框架部分，先提取核心功能快速掌握框架的应用，再用多个对应的实例分别讲解每个模块，最后逐一讲解框架的每个功能。对于代码部分，先演示程序效果，再根据需求总结涉及的知识点逐一讲解，然后组合成实例，最后总结分析重点功能的逻辑实现。3完整案例，代码实用 为了便于读者学习，本套图书
14、的全部案例都可以在商业项目中直接运用，丰富的案例几乎涵盖前端应用的各个方面。所有的案例都可以通过对应的二维码扫描，直接在手机上查看运行结果，读者可以通过仔细研究其效果，最大限度地掌握开发技术。另外，扫描每个章节中的资源下载二维码，可以获得下载链接，点击链接即可获取所有案例的完整源代码。4视频精致，立体学习 字不如表，表不如图，图不如视频，每本书都配有详细讲解的教学视频，由兄弟连名师 VI 细说网页制作 精心录制，不仅能覆盖书中的全部知识点，而且远远超出书中的内容。通过参考本套图书，再结合教学视频学习，可以加快对知识点的掌握，加快学习进度。读者可以扫描每个章节中提供的教学视频二维码，获取视频列表
15、直接在手机上观看，也可以直接登录“猿代码（）”平台在 PC 端观看，逐步掌握每个技术点。5电子教案，学教通用 每本书都提供了和章节配套的电子教案（PPT）。对于学生来说，电子教案可以作为学习笔记使用，是知识点的浓缩和重点内容的记录。由于本套图书可以作为高校相关课程的教材或课外辅导书，所以可以方便教师教学使用。读者可以通过扫描对应章节的二维码，下载或在线观看电子教案。本书为部分章节提供了一些扩展文章，也可以通过扫描二维码的方式下载或在线观看。6实时测试，寓学于练 每章最后都提供了专门的测试习题，供读者检验所学知识是否牢固掌握。通过扫描测试习题对应的二维码，可以查看答案和详细的讲解。7技术支持，服
16、务到位 为了帮助读者学到更多的 HTML5 技术，在兄弟连论坛（）中还可以下载常用的技术手册和所需的软件。笔者及兄弟连 IT 教育（新三板上市公司，股票代码：839467）的全体讲师和技术人员也会及时回答读者的提问，与读者进行在线技术交流，并为读者提供各类技术文章，帮助读者提高开发水平，解决读者在开发中遇到的疑难问题。本套图书的读者群 有审美，喜欢编程，并且怀揣梦想的有志青年。打算进入前端编程大门的新手，阶梯递进，由浅入深。专业培训机构前端课程授课教材，有体系地掌握全部前端技能。各大院校的在校学生和相关的授课老师，课件、试题、代码丰富实用。前端页面、Web APP、网页游戏、微信公众号等开发的前沿程序员，是专业人员的开发工具。其他方向的编程爱好者，需要前端技术配合，或转向前端开发的程序员。参与本书编写的人员还有李明霞、王宝龙和李明，在此一并表示感谢！2017 年 8 月 目录 CONTENTS 第 1 章 介绍 HTML5.1 1.1 了解 HTML5 的主流应用.1 1.1.1 表单的强大.2 1.1.2 响应式页面布局.2 1.1.3 与用户交互的特效.4 1.1.4 微网站的制作
