新書推薦:
《
无尽的海洋:美国海事探险与大众文化(1815—1860)
》
售價:NT$
454.0
《
治盗之道:清代盗律的古今之辨
》
售價:NT$
556.0
《
甲骨文丛书·剑桥世界暴力史(第一卷):史前和古代世界(套装全2册)
》
售價:NT$
959.0
《
甲骨文丛书·中华早期帝国:秦汉史的重估
》
售價:NT$
1367.0
《
欲望与家庭小说
》
售價:NT$
449.0
《
惜华年(全两册)
》
售價:NT$
320.0
《
甲骨文丛书·古代中国的军事文化
》
售價:NT$
454.0
《
中国王朝内争实录(套装全4册):从未见过的王朝内争编著史
》
售價:NT$
1112.0
|
編輯推薦: |
HTML5+CSS3+Flex+Bootstrap 项目任务式写法,适合高职教学 软件版本、技术* 基于工作过程的教学思想 将一个典型旅游网站的实现过程分解成若干子任务 任务描述+知识引入+任务实现+任务拓展+任务小结+课后练习 静态网页设计与制作+响应式网页实现
|
內容簡介: |
本书以一个完整旅游公司网站的开发项目为主线,贯穿所有知识点,较为全面地介绍了Web前端开发中使用HTML5和CSS3标准化重构网页的技术。 全书共10个任务,包括初探Web前端技术、使用HTML5搭建旅游公司网站首页结构、使用DIV+CSS实现旅游公司网站首页布局、使用CSS3美化超链接、使用CSS3制作导航、美化网页、添加用户交互界面——表单、使用Flex实现网页响应式布局、使用Bootstrap实现网页响应式布局、综合练习——儿童玩具商城网站设计与制作等。每一任务都配有课后练习,帮助读者及时巩固所学知识;*后一章的综合练习帮助读者进一步提升网页设计与制作的技能实践水平。
|
關於作者: |
唐彩虹,1980年2月22日出生,讲师。2006年6月获得暨南大学计算机软件专业硕士学位,2006年7月至今任职于广东轻工职业技术学院,担任信息技术学院数字媒体技术专业专任教师,从教至今一直讲授Web前端开发相关课程,指导学生实训和毕业设计,积累了丰富的授课经验,2012年起担任《网页制作》平台课程负责人,先后主持多项校级科研和教改项目,发表科研和教改论文十余篇。
|
目錄:
|
任务一 初探Web前端技术 1
任务描述 1
知识引入 1
1.网站、网页和主页 1
2.什么是Web和Web标准 4
3.Web前端技术的发展 4
4.搭建Web前端开发环境 5
5.Web页面的基本结构 6
6.浏览器兼容性 7
任务实现:动手编写第 一个前端页面 7
任务小结 10
课后练习 10
任务二 使用HTML5搭建旅游公司网站首页结构 11
任务描述 11
知识引入 11
1.HTML5的标题、段落和文本格式化标签 11
2.HTML5的图片标签 13
3.HTML5的列表标签 14
4.HTML5的超链接标签 15
5.HTML5的表格标签 17
6.传统的布局标签
和 19
7.HTML5的各种语义化分段元素 19
任务实现:搭建旅游公司网站首页结构 22
1.规划网站目录结构 22
2.分析首页文档结构 22
3.构建首页结构 22
4.添加网页内容 24
任务拓展:制作旅游公司网站二级页面 32
任务小结 35
课后练习 35
任务三 使用DIV CSS实现旅游公司网站首页布局 36
任务描述 36
知识引入 36
1.CSS规则的基本语法 36
2.CSS选择器 37
3.CSS规则的应用方式 40
4.CSS的层叠和继承 41
5.CSS盒子模型 43
6.CSS盒子的定位机制 46
7.DIV CSS布局剖析 51
任务实现:使用DIV CSS布局旅游公司首页 55
1.新建CSS样式表文件并应用到网页中 55
2.基础样式设置 55
3.头部布局与定位 56
4.主体内容.main_top区域布局与定位 56
5.主体内容.main_middle区域布局与定位 58
6.主体内容.main_bottom区域布局与定位 58
7.页脚区域布局与定位 58
任务拓展:使用CSS实现旅游公司网站二级页面华阳湖景区的布局结构 59
任务小结 61
课后练习 61
任务四 使用CSS3美化超链接 62
任务描述 62
知识引入 62
1.超链接的基本属性 62
2.CSS样式伪类 63
3.鼠标特效 64
任务实现:实现首页中的超链接效果 66
1.设置首页头部导航条超链接样式 66
2.设置尾部超链接样式 68
任务拓展:实现二级页面华阳湖景区的导航条链接 72
任务小结 73
课后练习 73
任务五 使用CSS3制作导航 74
任务描述 74
知识引入 74
1.列表符号 74
2.图片符号 76
3.列表符号位置 77
任务实现:制作旅游公司网站首页导航 79
1.水平排列导航条 79
2.编排页面中间内容区域 81
任务拓展:制作二级菜单和职位列表 84
1.制作二级菜单 84
2.制作职位列表 89
任务小结 93
课后练习 93
任务六 美化网页 94
任务描述 94
知识引入 94
1.text-shadow 94
2.box-shadow 96
3.border-radius 99
4.background 101
5.opacity 102
6.Font Awesome字体图标 103
7.Animation动画属性 105
任务实现:美化旅游公司网站页面 108
1.为网页添加图标 108
2.为按钮添加阴影 108
3.设置图片透明度 109
任务拓展:利用阿里巴巴矢量图标库制作购物车 110
任务小结 112
课后练习 113
任务七 添加用户交互界面表单 114
任务描述 114
知识引入 114
1.标签 115
2.元素 116
3.HTML5新增的类型 123
任务实现:制作旅游公司网站首页搜索框、意见反馈表 126
1.制作搜索框 126
2.制作意见反馈表 128
任务拓展:实现搜索框长度变化 133
任务小结 134
课后练习 134
任务八 使用Flex实现网页响应式布局 135
任务描述 135
知识引入 135
1.响应式布局基础知识 135
2.Flex布局 139
任务实现:使用Flex布局重构旅游公司首页 144
1.实现图片为响应式 145
2.设置怪异盒模型计算容器宽度 145
3.弹性文字 145
4.媒体查询 145
5.实现首页头部响应式效果 146
6.主体内容.main_top区域的实现 147
7.主体内容.main_middle区域的实现 148
8.主体内容.main_bottom区域的实现 149
9.实现页脚效果 150
任务拓展:使用Flex布局重构二级页面华阳湖景区 151
任务小结 152
课后练习 152
任务九 使用Bootstrap实现网页响应式布局 153
任务描述 153
知识引入 153
1.Bootstrap环境搭建 153
2.容器 154
3.栅格系统 154
4.样式 155
5.组件 156
任务实现:使用Bootstrap重构旅游公司首页 157
1.下载Bootstrap 157
2.网页头部代码实现 158
3.图片轮播效果代码实现 159
4.公司介绍区域代码实现 160
5.景区图片部分代码实现 161
6.求职信息区域代码实现 162
7.页脚区域代码实现 164
任务拓展:使用Bootstrap重构二级页面华阳湖景区 164
任务小结 167
课后练习 167
任务十 综合练习儿童玩具商城网站设计与制作 168
任务描述 168
任务实现:设计与制作儿童玩具商城网站 169
1.规划网站目录结构 169
2.首页代码实现 170
3.进口玩具页面代码实现 191
4.相关文章页面代码实现 201
5.联系我们页面代码实现 207
任务小结 209
课后练习 209
|
|