新書推薦:
《
亚洲戏剧史·南亚卷
》
售價:HK$
143.4
《
中国历代竹器图谱与数字活化
》
售價:HK$
557.8
《
EDA技术与设计(第2版)
》
售價:HK$
85.0
《
揉碎浪漫(全两册)
》
售價:HK$
70.3
《
古籍善本
》
售價:HK$
537.6
《
人民币国际化报告2024:可持续全球供应链体系与国际货币金融变革
》
售價:HK$
87.4
《
道德经新注 81幅作者亲绘哲理中国画,图文解读道德经
》
售價:HK$
143.4
《
清俗纪闻
》
售價:HK$
98.6
|
編輯推薦: |
本书自第一版出版以来,以其内容全面、实例丰富的特点,受到许多读者的喜爱。第2版在第1版的基础上,主要做了以下一些修订:调整了章节结构,例如把CSS的内容扩展到了3章,使本书的结构更加合理。根据Web前端技术的发展,新增了一节,对Vue.js较系统的介绍了入门实例,删除了部分比较旧的知识。特别是,第2版中增加了精心制作的21个微课视频,可帮助读者更好地阅读和学习相关内容。
|
內容簡介: |
本书涵盖了HTML5、CSS3、JavaScript、jQuery、Vue.js和Bootstrap等各种Web前端开发技术,在叙述有关原理时结合大量的相关实例。本书分为9章,内容包括Web前端开发概述,HTML5、CSS3语法基础、CSS盒子模型、CSS布局、表格与表单、响应式网页设计、JavaScript及其框架,Bootstrap响应式网页设计等。附录中安排了作为课程教学的实验。全书面向工程实际,强调原理性与实用性。 本书适合作为高等院校各专业“Web前端开发”或“网页设计”等课程的教材,也适合作为网页设计与制作的培训类教材,还可供网站设计和开发人员参考使用。
|
目錄:
|
第1章Web前端开发概述1
1.1Web前端开发与网页设计1
1.1.1网页的概念和本质1
1.1.2网页设计的两个基本问题2
1.1.3网页结构语言——HTML3
1.2网站的创建和制作流程4
1.2.1网站的特征4
1.2.2网站的开发步骤5
1.2.3网站的开发工具7
1.2.4在DW中建立站点8
1.3Web服务器与浏览器9
1.3.1Web服务器的作用9
1.3.2浏览器的种类和作用10
1.4URL与域名11
习题13第2章HTML514
2.1HTML概述14
2.1.1HTML文档的结构14
2.1.2DW的开发界面15
2.1.3使用DW新建HTML文件16
2.1.4HTML标记16
2.1.5常见的HTML标记及属性17
2.2创建文本和图像18
2.2.1创建文本和列表18
2.2.2插入图像20
2.3利用DW代码视图提高效率21
2.3.1代码提示22
2.3.2代码快速定位22
2.3.3DW中的常用快捷键23
2.4创建超链接23
2.4.1超链接标记24
2.4.2绝对URL与相对URL26
2.4.3超链接的种类27
2.4.4超链接目标的打开方式28
2.4.5超链接制作的原则29
2.4.6DW中超链接“属性”面板的使用29
2.5插入多媒体元素及嵌入网页30
2.5.1HTML5的视音频功能30
2.5.2嵌入式框架标记32
2.6头部标记33
2.7HTML元素的概念34
2.7.1行内元素和块级元素35
2.7.2和标记35
2.8HTML5的改进36
2.8.1HTML5新增的标记36
2.8.2HTML5语法的改进38
2.8.3HTML5的绘图功能39
习题41第3章CSS3语法基础43
3.1CSS基础43
3.1.1CSS的语法43
3.1.2在HTML中引入CSS的方法44
3.1.3选择器的分类45
3.1.4CSS文本修饰48
3.2CSS的特性49
3.2.1CSS的层叠性49
3.2.2CSS的继承性51
3.2.3选择器的组合53
3.3CSS高级选择器56
3.3.1关系选择器56
3.3.2属性选择器58
3.3.3伪类选择器59
3.3.4使用过渡属性配合动态伪类效果62
3.3.5伪元素选择器65
3.4CSS设计和书写技巧67
3.4.1CSS样式总体设计原则67
3.4.2DW对CSS的可视化编辑支持68
3.4.3CSS的值和单位70
3.4.4网页中的字体71
3.4.5字体图标技术73
3.5Web标准74
3.5.1传统HTML的缺点75
3.5.2Web标准的含义75
3.5.3Web标准的优势77
习题78第4章CSS盒子模型80
4.1盒子模型及其属性80
4.1.1盒子模型概述80
4.1.2边框border属性81
4.1.3圆角borderradius属性83
4.1.4图像边框borderimage属性85
4.1.5padding和margin属性86
4.2标准流下的定位及应用88
4.2.1标准流下的定位原则88
4.2.2margin合并现象90
4.2.3盒子模型的应用92
4.2.4Chrome浏览器的调试功能94
4.3背景的运用95
4.3.1CSS的背景属性95
4.3.2背景的基本运用技术99
4.3.3滑动门技术102
4.3.4背景图像的翻转107
4.3.5传统圆角效果108
4.4CSS3样式美化功能109
4.4.1阴影和发光效果109
4.4.2渐变效果112
4.4.3描边效果116
4.4.4遮罩效果116
4.5变形与动画效果118
4.5.1平面变形效果118
4.5.23D变换效果122
4.5.3animation动画效果126
习题128第5章CSS布局130
5.1浮动130
5.1.1盒子浮动后的特点130
5.1.2清除浮动元素的影响132
5.1.3清除浮动影响的方法133
5.2浮动的应用举例135
5.2.1图文混排及首字下沉效果135
5.2.2水平导航条137
5.2.3新闻栏目框138
5.2.4微博对话框141
5.3相对定位142
5.3.1定位属性和偏移属性142
5.3.2相对定位的特点142
5.3.3相对定位的应用举例143
5.4绝对定位和固定定位145
5.4.1绝对定位145
5.4.2绝对定位的应用举例147
5.4.3固定定位155
5.4.4与定位属性有关的CSS属性155
5.4.5overflow属性157
5.4.6verticalalign属性159
5.5CSS分栏布局160
5.5.1分栏布局的种类161
5.5.2网页居中的方法161
5.5.3131版式网页布局162
5.5.4121可变宽度布局165
5.5.5CSS两列布局案例167
5.5.6HTML5文档结构标记172
5.5.7HTML5网页布局案例173
5.6CSS3新增的布局方式177
5.6.1弹性盒布局177
5.6.2分栏布局180
习题182第6章表格与表单184
6.1创建表格184
6.1.1表格标记184
6.1.2表格行和单元格标记185
6.1.3在Dreamweaver中操作表格的方法188
6.1.4制作固定宽度的表格189
6.1.5特殊效果表格的制作190
6.2使用CSS美化表格192
6.2.1边框和背景的美化192
6.2.2隔行变色效果192
6.3创建表单193
6.3.1标记及其属性194
6.3.2标记196
6.3.3和标记199
6.3.4多行文本域标记199
6.3.5表单数据的传递过程200
6.3.6表单中的按钮201
6.3.7表单的辅助标记202
6.3.8HTML5新增的表单标记和属性202
6.4美化表单206
6.4.1搜索框206
6.4.2用户登录表单207
6.4.3用户注册表单209
习题211第7章响应式网页设计213
7.1响应式网页的基本技术213
7.1.1媒体查询213
7.1.2流式布局215
7.1.3自适应图片217
7.1.4一列变宽一列固定的效果218
7.1.5响应式网页的头部代码设置219
7.1.6CSS变量220
7.2响应式布局的网站实例221
7.2.1页面总体布局的实现222
7.2.2页头的设计223
7.2.3响应式导航条的制作224
7.2.4响应式栏目的制作226
习题227第8章JavaScript及其框架228
8.1JavaScript的代码结构228
8.2JavaScript的事件编程229
8.2.1JavaScript语言基础229
8.2.2常用JavaScript事件230
8.2.3事件监听程序231
8.3JavaScript DOM编程233
8.3.1动态效果的实现233
8.3.2获取指定元素234
8.3.3访问元素的CSS属性235
8.3.4访问元素的内容236
8.4使用浏览器对象237
8.5jQuery基础240
8.5.1jQuery的功能和使用240
8.5.2jQuery中的“$”241
8.5.3jQuery对象与DOM对象245
8.5.4jQuery的选择器246
8.5.5jQuery的事件绑定247
8.5.6jQuery中的常用方法248
8.5.7jQuery应用举例249
8.6Vue基础251
8.6.1简单的Vue程序252
8.6.2Vue绑定数据实现动态效果254
8.6.3vif和vfor指令257
习题261第9章Bootstrap响应式网页设计264
9.1Bootstrap的使用264
9.1.1下载和引用Bootstrap框架264
9.1.2Bootstrap栅格系统266
9.1.3栅格系统列的调整268
9.2Bootstrap中的网页组件274
9.2.1基于组件的网页制作方法274
9.2.2导航条275
9.2.3轮播插件279
9.2.4选项卡面板282
9.2.5媒体对象284
9.2.6折叠面板组286
9.2.7提示框与弹出框287
9.2.8模态弹窗289
9.3Bootstrap网页重构实例290
习题293附录A实验294参考文献298
|
內容試閱:
|
Web前端开发是高校很多专业开设的一门专业课程。该课程起源于网页制作,课程的基础内容以网页及网站开发技术为主,但广义上的Web前端开发(俗称“大前端”)还包括移动App、微信小程序等任何互联网产品的开发,因此Web前端开发是对网页制作课程的继承和拓展。
Web前端开发同时又是相关专业学生的一项基本技能,就业市场对Web前端开发的人才需求量很大。前端开发技能之所以重要,是因为前端开发涉及界面设计和交互,个性化要求很高,导致项目的重用性水平低,这使得前端开发人才需要掌握更多相关领域的知识,前端开发者需要具备良好的自学能力和强烈的兴趣。
因此,前端开发的教学任务可分为两大块,即传授知识和培养兴趣。笔者认为教学的核心目标是学生能将各种知识点灵活运用。如果上课讲授的知识点过多、过细,则学生往往会无法将这些知识点运用到实践中;如果讲授的知识点过少,片面强调让学生实践,则学生由于对许多知识点没有系统领会,又容易陷入低水平的盲目实践。
为此,本书在编写时,首先,注重培养学生兴趣,在章节安排上尽快让学生进入CSS阶段的学习,将表格和表单的内容安排在CSS基础知识之后。这是因为只有接触了CSS,学生才会领会CSS的乐趣。本书重点讲授CSS的内容,因为CSS仍然是“Web前端开发”这门课程最核心的内容。其次,虑及初学者没有网页设计语言基础,本书将传统CSS知识和CSS3的内容进行统一编排,从而更容易地系统掌握CSS的传统技术和新技术。Bootstrap作为前端开发的一种流行技术,代表了网页制作技术的两大发展趋势: 一是响应式网页布局的趋势,可以说,响应式网页布局将是网页布局历史上的第二次革命;二是基于组件的网页制作方法,这种网页制作方法能避免从头开始写代码,避免了过去网页制作过程中令人厌倦的重复劳动,极大地提高了网站的开发效率。
“Web前端开发”这门课程对项目案例的选择有很高要求,为了培养学生在Web前端领域具备解决复杂工程问题的能力,建议采用基于组件技术与团队化开发的真实项目进行训练。但真实的Web开发项目中往往大部分代码是简单知识点的重复运用,实际上并不适合在教材中全面叙述。为此,本书在配套的实验代码中提供了几个较完整的案例,教师在讲授前把这些案例的制作过程练习熟练,并且把制作的每个阶段性成果都保存下来,就可有效指导学生制作这些案例。
本书自第1版出版以来,以其内容全面、实例丰富的特点,受到许多读者的喜爱。第2版在第1版的基础上,主要做了以下一些修订: 调整了章节结构,例如,把CSS的内容扩展到了3章,使本书的结构更加合理;根据Web前端技术的发展,新增了一节,对Vue.js较系统地介绍了入门实例,删除了部分比较旧的知识,如CSS的浏览器兼容性;为本书的有关内容制作了21个微课视频,可帮助读者更好地阅读和学习。
为了便于读者阅读和减少篇幅,本书采用精简代码的编排方式,读者一般能够容易地将其还原成完整代码,同时每个示例都标有序号(例如,例34对应的源代码文件就是34.html),读者能够在配套源代码中找到对应的完整代码并能直接运行。
本书的教学大概需要64学时,其中,实验学时不少于16学时。如果学时量不足,则可以主要讲授第1~5章的内容。
本书还为教师提供了教学多媒体课件、实例源文件和实验大纲,可登录本书的配套网站https://mooc1.chaoxing.com/course/201693064.html免费下载。
本书由唐四薪、唐琼、李浪编著,唐四薪编写了第3~9章的内容,唐琼、李浪编写了第1章和第2章的部分内容,唐金娟编写了第2章的部分内容。
由于作者水平和教学经验有限,书中疏漏和不足之处在所难免,欢迎广大读者和同行批评指正。
作者
2022年12月
|
|