书海网短评:
●货真料足:著名一线前端开发专家阮晓龙老师多年学习、研究、授课及实战经验的结晶●内容系统全面:一站式解决HTML5+CSS3+JavaScript+jQuery+AJAX+AngularJS学习●
●货真料足:著名一线前端开发专家阮晓龙老师多年学习、研究、授课及实战经验的结晶
●内容系统全面:一站式解决HTML5+CSS3+JavaScript+jQuery+AJAX+AngularJS学习
●讲解深入浅出:知识点清晰详细,每分钟一个知识点,每个知识点都能看到学习效果,每个效果都能扫二维码直接在手机观看。
●全屏幕适配:支持移动Web开发,引入“浏览器支持”工程理念。
●理论实战紧密结合,彻底摆脱纸上谈兵,,案例精彩贴近实战,商业化开发特色突出。
●超值DVD:DVD包含了《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》学习所需用到的所有软件,如设计工具、浏览器、项目管理工具、开发工具、测试工具以及其它辅助工具;《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》的所有案例及源码;多媒体教学课件。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》是经过数万读者检验的畅销图书《Web前端开发从学到用完美实践》的升级版本,同时也是作者十几年的教学与企业级开发经验的结晶。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》系统讲述了Web前端开发的全栈知识,由浅入深,通俗易懂,知识点与案例结合紧密,所选案例新颖丰富,紧贴企业实战,所有案例运行结果都可通过二维码实时呈现。《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》的讲解从Web基础知识开始,循序渐进地融入了HTML5、CSS3、JavaScript、jQuery、AJAX、AngularJS、绘图、地理定位、本地存储及Web测试与发布等实用技术,是一本真正的Web前端开发的从学到用全栈教程。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》适合于想从事网站前端开发工作和正在从事网站前端开发工作的开发工程师参考使用。《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》配套光盘提供多媒体教学资源、所有案例及源代码,以及案例开发用到的软件。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》配套光盘提供多媒体教学资源、所有案例及源码,以及实验用到的部分软件
阮晓龙:
河南省重点学科计算机科学与技术学科互联网应用技术学科方向带头人,河南中医药大学管理科学与工程学科主任,一线资深网络技术及Web技术专家,副教授。
曾参与河南省教育科研网郑东新区节点建设及运维;曾参与多项大型门户网站的建设工作;曾参与河南中医药大学数字化校园示范工程建设项目。主持参与厅级以上科研项目9项,主持获得厅级一等奖以上奖励7项,荣获“河南省教学标兵”称号。主编著作与教材4部,参编著作与教材6部,公开发表论文20余篇,个人取得软件著作权12项。
作者的话
配套光盘使用说明
第1章概述1
1.1Web基础2
1.2Web是如何工作的?10
1.3为什么学习Web前端开发?16
1.4项目管理系统19
第2章开发工具21
2.1开发工具综述22
2.2原型设计工具22
2.3开发工具29
2.4调试工具41
2.5代码托管工具48
2.5.5案例:使用GitHub开源平台实现网站代码托管49
第3章初识HTML555
3.1HTML概述56
3.2HTML5的优势57
3.4HTML5文档结构70
第4章HTML5结构与属性73
4.1从HTML4到HTML574
4.2HTML5基础76
4.3HTML5结构元素87
4.4超链接99
第5章表单102
5.1表单基础103
5.2使用form元素108
5.3使用input元素111
5.4案例:高考改革方案调查问卷网页的实现126
5.5案例:智能表单(用户注册)130
第6章多媒体135
6.1多媒体基础136
6.2HTML5音频与视频139
6.3播放控制147
6.4解决兼容问题158
6.5字幕161
第7章初识CSS3167
7.1CSS3概述168
7.2CSS3功能172
7.3在HTML中使用CSS174
7.4案例:基于终端设备选择不同样式177
7.5案例:基于浏览器选择不同样式178
第8章选择器179
8.1认识CSS选择器180
8.2基础选择器180
8.3层次选择器186
8.4伪类选择器191
8.5属性选择器208
第9章文字样式213
9.1文本样式214
9.2字体样式222
9.3字体图标226
9.4文本效果228
9.5使用服务器端字体231
9.6案例:诗歌排版232
9.7案例:使用服务器端字体实现网站图标234
第10章背景与边框236
10.1背景属性237
10.1.1基本属性237
10.1.2CSS3新增背景属性238
10.1.3多背景241
10.1.4渐变背景243
10.2边框属性245
10.2.1基本属性245
10.2.2CSS3新增边框属性247
10.2.3圆角边框248
10.2.4图片边框251
10.2.5渐变边框256
10.2.6盒子阴影257
10.3案例:图片轮转的实现264
10.4案例:网页课程表的实现266
第11章盒模型271
11.1盒子272
11.1.1元素盒子272
11.1.2尺寸280
11.2盒子类型281
11.2.1盒子的基本类型281
11.2.2CSS3新增的类型287
11.2.3浏览器对盒子的支持情况293
11.3盒子的属性294
11.3.1内容溢出294
11.3.2自由缩放299
11.3.3外轮廓299
11.3.4阴影301
11.4浏览器的盒子调试304
11.4.1在InternetExplorer浏览器中进行盒子调试305
11.4.2在Firefox浏览器中进行盒子调试307
11.4.3在GoogleChrome浏览器中进行盒子调试307
11.4.4在MicrosoftEdge浏览器中进行
盒子调试308
第12章布局311
12.1定位与布局的基本属性312
12.1.1基本属性312
12.1.2外边距与内边距312
12.1.3浮动布局313
12.1.4定位布局318
12.2多列布局325
12.2.1多列布局的基本知识325
12.2.2多列布局的基本属性326
12.2.3多列布局属性326
12.2.4列宽与列数326
12.2.5列边距与列边框326
12.2.6跨列布局327
12.2.7列高327
12.3盒布局329
12.3.1盒布局的基本知识329
12.3.2盒布局的基本属性329
12.3.3使用自适应宽度的弹性盒布局329
12.3.4改变元素的显示顺序332
12.3.5改变元素排列方向334
12.3.6使用弹性布局消除空白335
12.3.7对多个元素使用box-flex属性336
12.3.8对齐方式337
12.3.9布局方式对比339
12.4自适应布局343
12.4.1自适应布局的基本知识344
12.4.2自适应布局的基本属性344
12.4.3允许网页宽度自动调整344
12.4.4不使用绝对宽度344
12.4.5相对大小的字体345
12.4.6流动布局345
12.4.7选择加载CSS345
12.4.8CSS的@media规则345
12.4.9图片的自适应346
12.5案例:网页布局348
第13章CSS动画359
13.1Web动画360
13.1.1GIF动画360
13.1.2Flash动画360
13.1.3JavaScript动画360
13.1.4CSS3动画361
13.2使用变形属性361
13.2.1进行简单变形361
13.2.2变形子属性362
13.2.32D变形函数369
13.2.43D变形函数372
13.2.5案例:制作时钟375
13.3使用过渡属性378
13.3.1设置元素过渡378
13.3.2设置过渡元素379
13.3.3设置过渡持续时间380
13.3.4指定过渡函数381
13.3.5规定过渡延迟时间385
13.3.6过渡触发386
13.3.7案例:制作动态网站导航387
13.4使用动画属性390
13.4.1建立基本动画390
13.4.2动画关键帧392
13.4.3动画子属性393
13.4.4给元素应用动画395
13.4.5案例:实现页面加载动画396
13.5案例:引人入胜的动态照片墙402
第14章初识JavaScript405
14.1JavaScript概述406
14.1.1什么是JavaScript?406
14.1.2JavaScript能够实现什么?407
14.2语法407
14.2.1调用方法407
14.2.2基本语法408
14.2.3函数417
14.2.4对象418
14.3DOM419
14.3.1什么是DOM?419
14.3.2获取HTML元素419
14.3.3对HTML元素进行操作421
14.4案例:使用JavaScript进行表单验证423
14.4.1功能423
14.4.2实现效果423
14.4.3代码424
14.5案例:使用JavaScript实现规定时间内答题效果427
14.5.1功能427
14.5.2实现效果427
14.5.3代码428
第15章jQuery编程430
15.1jQuery概述431
15.1.1jQuery简介431
15.1.2为什么要使用jQuery?432
15.1.3其他的JavaScript类库433
15.2jQuery基础应用434
15.2.1调用方法434
15.2.2基本语法434
15.2.3选择器435
15.2.4事件445
15.2.5常用效果449
15.2.6案例:使用jQuery实现图片轮转456
15.3jQuery中的DOM操作459
15.3.1DOM操作基础459
15.3.2节点操作460
15.3.3属性操作467
15.3.4样式操作468
15.3.5内容操作470
15.3.6案例:使用jQuery实现表格排序472
15.4jQuery插件474
15.4.1什么是jQuery插件?474
15.4.2jQueryUI475
15.4.3jQueryMobile479
15.5案例:使用jQuery插件实现表单验证483
15.5.1功能483
15.5.2实现效果484
15.5.3代码484
15.6案例:使用JQueryMobile快速开发手机网站485
15.6.1功能485
15.6.2实现效果485
15.6.3代码486
第16章AJAX488
16.1概述489
16.1.1什么是AJAX?489
16.1.2为什么使用AJAX?489
16.1.3AJAX的优势489
16.1.4AJAX的应用场景489
16.2基础知识490
16.2.1XML490
16.2.2xmlHttpRequest491
16.2.3工作原理491
16.3AJAX实现492
16.3.1案例:使用AJAX基于本地XML实现学生成绩册492
16.3.2案例:使用AJAX读取网易新闻列表495
16.4使用jQuery实现AJAX497
16.4.1基本方法497
16.4.2jQuery中的全局事件509
16.5案例:实时表单验证510
第17章AngularJS518
17.1AngularJS概述519
17.1.1AngularJS简介519
17.1.2AngularJS特性519
17.1.3AngularJS框架520
17.2AngularJS基本概念520
17.3AngularJS应用521
17.3.1AngularJS初始化521
17.3.2指令523
17.3.3模板523
17.3.4表达式524
17.3.5作用域524
17.3.6控制器526
17.3.7过滤器526
17.3.8表单528
17.3.9模块530
17.3.10路由530
17.3.11服务534
17.4案例:使用AngularJS实现即时搜索537
第18章文件540
18.1文件存储541
18.2处理用户文件541
18.2.1读取文件541
18.2.2读取文件属性543
18.2.3文件分割545
18.2.4处理事件547
18.3文件操作549
18.3.1本地磁盘操作549
18.3.2创建文件552
18.3.3创建目录553
18.3.4列出文件553
18.3.5处理文件557
18.3.6移动557
18.3.7复制560
18.3.8删除560
18.4文件内容操作561
18.4.1写入内容561
18.4.2追加内容564
18.4.3读取内容564
18.5案例:用户本地资源管理567
第19章绘图575
19.1Canvas基础知识576
19.1.1Canvas576
19.1.2绘图方法577
19.1.3绘图属性578
19.2图形绘制579
19.2.1矩形579
19.2.2线条581
19.2.3多边形581
19.2.4圆角矩形583
19.2.5圆形584
19.2.6曲线586
19.2.7文字588
19.2.8图像592
19.3图形变换与控制600
19.3.1坐标变换600
19.3.2矩阵变换604
19.3.3设置阴影605
19.3.4叠加风格607
19.3.5填充风格608
19.4案例:用Canvas绘制统计报表612
第20章本地存储616
20.1基础知识617
20.1.1本地存储简介617
20.1.2本地存储类型617
20.2Cookie619
20.2.1Cookie概述619
20.2.2数据操作619
20.2.3案例:在网站中自动记录用户状态621
20.3WebStorage623
20.3.1sessionStorage623
20.3.2localStorage626
20.3.3对比分析628
20.4本地数据库628
20.4.1存储原理628
20.4.2数据操作629
20.5案例:使用本地存储减少服务器数据库请求635
第21章地理定位641
21.1常见地理定位方式642
21.1.1IP定位642
21.1.2GPS定位642
21.1.3Wi-Fi定位642
21.1.4手机基站定位642
21.2使用HTML5实现地理定位642
21.2.1浏览器支持性检查643
21.2.2位置请求643
21.2.3隐私保护646
21.3案例:使用百度地图展示当前位置646
21.4案例:使用百度地图展示运动轨迹648
第22章Web测试652
22.1概述653
22.1.1什么是Web测试?653
22.1.2测试内容653
22.1.3测试目的654
22.2用户界面测试654
22.2.1导航测试654
22.2.2图形测试655
22.2.3内容测试655
22.2.4整体界面测试655
22.3兼容性测试655
22.3.1平台兼容性测试655
22.3.2浏览器兼容性测试657
22.3.3分辨率兼容性测试658
22.4功能测试659
22.5性能测试662
22.5.1连接速度测试663
22.5.2压力测试667
第23章网站发布676
23.1概述677
23.2域名注册677
23.2.1什么是域名注册?677
23.2.2如何注册域名?677
23.2.3实训:通过阿里云进行域名注册677
23.3Web服务器构建680
23.3.1什么是Web服务器?680
23.3.2如何构建Web服务器?680
23.3.3实训:使用阿里云构建Web服务器680
23.4网站上传686
23.5网站备案686
23.5.1什么是网站备案?686
23.5.2实训:通过阿里云进行网站备案686
23.6域名解析688
23.6.1什么是域名解析?688
23.6.2实训:在阿里云上配置域名解析689
参考文献691
在日益互联网化的今天,Web技术已经成为一门广泛应用的技术。除了日常的网站访问和信息浏览,Web已成为各种设备的有机组成部分。例如交换机、路由器、服务器等硬件设备都可以通过Web方式进行管理,并且这种方式得到了越来越多的应用,各种信息技术都在不断“Web化”。
不仅如此,学习Web前端开发技术具有以下优势:
lWeb前端开发入门门槛低,但市场需求量大,尤其是有经验的前端开发人员。
lWeb前端开发人员可在短期内积累足够的经验,而后端开发人员想要积累同等的经验则需要更长的时间。
lWeb前端开发技术发展越来越成熟,且适用范围更广。比如HTML5可以替代原生APP,JavaScript能够用于数据库操作(MongoDB等NoSQL技术也支持JS语法),Node.js能够让JavaScript在服务器端运行等。
2.为什么要选择《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》?(1)涵盖Web前端开发的全体系内容。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》的内容安排遵循Web开发流程及由浅入深的认知规律,首先介绍Web的基本概念及Web开发工具,然后讲解Web前端开发的三大核心内容—HTML5、CSS3、JavaScript,随后介绍jQuery和AngularJS,接着进一步介绍HTML5新增的文件接口、绘图元素、本地存储和地理定位功能,最后讲解Web测试与发布技术。通过这《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》,读者可以掌握Web前端开发的全体系知识。
(2)引入“浏览器支持”的工程理念。
Web前端开发的结果要通过浏览器进行展示。《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》在讲解HTML5和CSS3的各种元素、属性时,明确说明了各种浏览器对这些元素的支持;《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》中所有的案例都进行了主流浏览器兼容性测试,并对测试结果进行了说明,从而使读者尤其是初学者,在学习之初就能树立起“浏览器支持”这一Web前端开发中的重要工程理念。
(3)书中案例具有较高的工程度和成熟度。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》包含300多个案例,既有针对一个元素的小案例,也有综合性的大案例。所有案例都经过了精心设计,案例代码的成熟度和工程应用程度较高,许多案例达到了企业级应用水平。读者在学习《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》时可以通过案例更好地理解知识和掌握应用技术,同时这些案例也能成为读者积累的代码库中的一部分,在进行实际项目开发时直接引用,真正起到“拿来就用”的作用,有效降低读者从学习到项目开发的成本。
(4)明确体现商业化开发的特点。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》作者及案例设计团队具有多年的商业化Web前端开发经验。《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》在内容组织、案例设计、编写形式上明确体现了商业化开发的特点,有助于读者更好地实现从学习到应用的转变。
(5)全屏幕适配,支持移动Web开发。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》的内容不仅考虑了面向PC的Web开发,也考虑了面向移动终端的Web开发,《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》的讲解重新考虑“全终端适配”的概念,让读者能够更加全面地理解Web前端开发的应用范围,充分适应移动互联网的时代特征。
3.读者对象《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》适用于以下三类读者。
一是从事Web前端开发工作的专业技术人员,《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》可帮助他们进行深入、系统的深造学习,从而更好地理解Web知识体系、提高工作效率。
二是准备从事Web前端开发工作的入门者,《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》可帮助他们全面理解并掌握Web前端开发的技术框架,为系统学习Web前端开发指引方向,为后续工作学习打下扎实基础。
三是高等院校中计算机相关专业特别是计算机科学与技术、软件技术类专业的在校学生,《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》可帮助他们从零开始学习Web技术,不断加深对Web前端开发技术的理解,并且通过大量案例提升实践操作的综合能力,做到“学以致用”。
4.主要内容《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》共23章,从内容组织上看,包括Web基础、HTML5、CSS3、JavaScript及开发库、Web前端开发高级应用、Web测试与发布六个部分。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》在保留第一版主要内容的基础上,更新并补充了行业应用的新技术热点,进一步优化章节结构,调整了《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》内容组织体系。调整的具体内容为新增第17章、第21章、第23章,并调换了第一版第10章和第11章的顺序。《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》反映了Web前端开发技术的最新发展状况,主要内容如下:
第1~2章属于Web基础部分。主要介绍Web的基本概念、工作原理、Web前端开发的含义,重点讲解Web前端开发的每个阶段中所使用的开发工具,帮助读者为后续学习打下基础。
第3~6章属于HTML5部分。主要介绍HTML5的发展、优势、功能、新特征以及各种元素、属性的用法、重点讲解HTML5表单和多媒体的应用技术。
第7~13章属于CSS3部分。主要介绍CSS3的发展、功能、新特征,重点讲解CSS3中选择器、文字样式、背景与边框、盒模型、布局、动画的应用技术。
第14~17章属于JavaScript及开发库部分。主要介绍JavaScript的发展、功能、基本语法,重点讲解jQuery、AJAX、AngularJS的应用技术。
第18~21章属于Web前端开发的高级应用部分。主要讲解HTML5新增的文件接口、绘图元素、本地存储和地理定位功能。
第22~23章属于Web测试与发布部分。主要介绍Web测试的基本内容、Web测试的常用方法和常见测试软件,并详细介绍网站发布的流程。
《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》第1版发布后,作者开始积极探索科研、教研和教学工作的融合以及团队建设模式,初步形成了松散模式的技术团队和《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》创作小组。刘明哲、冯顺磊、路景鑫、贺路路、孙高强、董凯伦、张浩林全程参与了改版方案及《Web前端开发从学到用完美实践——HTML5+CSS3+JavaScript+jQuery+AJ》内容与案例的讨论、审核和校对。在此对他们表示诚挚的谢意。
由于作者水平有限,疏漏及不足之处在所难免,敬请广大读者朋友批评指正。
阮晓龙









