|
关于我们
 精品教材 更多 规划教材 更多 |
Web前端开发必知必会 
定 价：53 元 丛书名：
适用读者:电子信息类专业的学生，电子商务、机电等专业学生，中外合作相关专业留学生，Web前端开发爱好者、自学者
9 7 4 8 7 7 5 1 4 2 4 1 3 
本教材共分18课（章），每课根据实际情况需要3～8个学时，第1课到第10课，主要介绍了HTML基本框架，标签与属性，CSS样式基础，教会读者利用盒子模型，结合HTML5结构化标签，建立基本的页面框架，以及固定宽度布局的模板网页，第11～16课介绍了JavaScript特效应用、表单、响应式设计、弹性图像与弹性布局、flexbox伸缩盒等实际Web前端开发必备的知识点，并辅助以若干个对应知识点的网页实例；第17课~18课则介绍了网站建设的基本规范、API工具等，便于读者后续的学习与实践。读者在学习了第1～10课后，将初步掌握Web页面制作基础，然后继续学习后续的课程章节，学习实际Web前端开发应用必备的知识，通过涵盖各个知识点的案例进行实践，快速、高效地掌握实用网页制作的基本方法。另外，将另外提供教材中涉及的全部网页源代码网络资源，方便社会读者自学。
张怡芳，浙江机电职业技术学院副教授。曾主持建筑结构智能化设计及其技术规范研究（浙江省教育厅，2002.06-2004.06）、建筑CAD图形智能识别技术研究（浙江万里学院重点，2002.04-2005.04）等科研项目，以及信管专业"WEB前端设计”渐进式课程教学改革探索（机电学院重点项目，2015.06）等教改项目。所参与的"渐进式‘Web前端设计’与成长型思维训练教学探索”荣获浙江省计算机应用与教育学会教育委员会第20届年会优秀论文。曾出版《计算机图形学基础及应用教程》等。
第1 课 Web 前端简介 1
1.1 Web 前端与HTML ............................2 1.1.1 什么是Web 前端 ..........................2 1.1.2 Web 是如何工作的 .......................2 1.1.3 网站与HTML 网页 ......................3 1.1.4 网站类型 ........................................3 1.2 HTML 文件结构 ................................5 1.3 网页三要素：结构、表现、行为 ....6 1.4 网页编码工具 ....................................8 1.4.1 使用记事本编写网页代码 ............8 1.4.2 浏览器的开发者工具 ....................8 1.4.3 IDE 简介 ......................................10 1.4.4 HBuilderX 环境 ...........................10 1.5 每课小练 ..........................................12 1.5.1 练一练： 制作带图像的简单网 页..................................................12 1.5.2 试一试：制作航天新闻网页 ......14 1.5.3 常见问题Q＆A ............................16 1.6 理论习题 ..........................................16 第2 课 常用的HTML 标签及其属性 18 2.1 常用的标签 ......................................19 2.1.1 什么是标签 ..................................19 2.1.2 标签的属性 ..................................21 2.2 特殊符号 ..........................................22 2.3 表格 ..................................................23 2.4 图像 ..................................................25 2.4.1 内容图像 ......................................25 2.4.2 背景图像 ......................................25 2.5 每课小练 ..........................................26 2.5.1 练一练：基本标签的应用 ..........26 2.5.2 试一试：图像与表格 ..................28 2.5.3 常见问题Q＆A ............................32 2.6 理论习题 ..........................................32 第3 课 超链接与路径 34 3.1 超链接 ..............................................35 3.1.1 超链接标签及其属性 ..................35 3.1.2 锚记 ..............................................35 3.2 路径 ..................................................36 3.2.1 绝对路径 ......................................36 3.2.2 相对路径 ......................................37 3.3 每课小练 ..........................................38 3.3.1 练一练：简单超链接 ..................38 3.3.2 学以致用：再别康桥网页 ..........39 3.3.3 常见问题Q＆A ............................41 3.4 理论习题 ..........................................42 第4 课 简单CSS 43 4.1 CSS 样式概述 ..................................44 4.1.1 CSS 样式的作用..........................44 4.1.2 什么是选择器 ..............................44 4.1.3 CSS 选择器类型............. 47 4.1.4 基本选择器命名规则 ..................49 4.2 颜色模型 ..........................................49 4.3 设置网页的文本颜色与背景颜色 ..52 4.3.1 设置文本颜色 ..............................52 4.3.2 设置背景颜色 ..............................52 4.3.3 使用拾色器 ..................................53 4.3.4 设置背景图像 ..............................53 4.4 每课小练 ..........................................55 4.4.1 练一练：标签选择器练习 ..........55 4.4.2 练一练：制作基本网页模板 ......58 4.4.3 学以致用：使用float 属性水平排列扑克牌.......................................60 4.4.4 常见问题Q＆A ............................64 4.5 理论习题 ..........................................65 第5 课 复合选择器与网页导航菜单 68 5.1 什么是复合选择器 ..........................69 5.1.1 复合选择器的种类 ......................69 5.1.2 后代选择器与子元素选择器的 区别..............................................70 5.1.3 毗邻兄弟选择器与同级兄弟选择 器的区别......................................70 5.1.4 结构化伪类选择器与伪元素 详解 ..............................................71 5.1.5 导航菜单超链接使用的选择器 ..73 5.2 无序列表导航菜单 ..........................74 5.2.1 只改变字体颜色 ..........................74 5.2.2 链接项呈现块级变化......... 77 5.3 常见的CSS1 ～ CSS3 选择器 ........79 5.4 每课小练 ..........................................80 5.4.1 练一练：后代选择器与横向导航 菜单...............................................80 5.4.2 学以致用：复合选择器与太阳系 网页..............................................81 5.4.3 常见问题Q＆A ............................87 5.5 理论习题 ..........................................87 第6 课 基本HTML5 框架与应用 90 6.1 什么是语义化结构标签 ..................91 6.2 语义化结构标签的应用 ..................92 6.3 ＜meta＞ 标签 .....................................93 6.3.1 ＜meta＞ 标签的基本用途 ............93 6.3.2 控制响应式设计中的视口 ..........93 6.3.3 设置网页的定时跳转 ..................93 6.4 每课小练 ..........................................94 6.4.1 练一练：使用＜section＞ 标签的上 下结构网页框架 .........................94 6.4.2 学以致用：使用CSS 实现个人简 历网页..........................................97 6.4.3 常见问题Q＆A ............................99 6.5 理论习题 ........................................100 第7 课 盒子模型与DOM 树 102 7.1 DOM 树与文件流 ..........................103 7.2 盒子模型 ........................................103 7.2.1 什么是盒子模型 ........................103 7.2.2 容器与元素关系 ........................104 7.2.3 块级元素与行内元素 ................105 7.3 float 与clear 属性 ..........................106 7.3.1 标准文件流 ................................106 7.3.2 使用float 属性使元素脱离标 准流 ............................................106 7.3.3 使用clear 属性清除浮动的 影响 ............................................107 7.4 每课小练 ........................................107 7.4.1 练一练：float 与clear 属性的 应用 ............................................107 7.4.2 学以致用：制作IPanda 网页...109 7.4.3 常见问题Q＆A .......................... 113 7.5 理论习题 ........................................ 113 第8 课 position 位置属性 115 8.1 叠放层与漂浮层 ............................ 116 8.1.1 position 位置属性 ...................... 116 8.1.2 z-index 属性 ............................... 116 8.2 relative 与absolute 的精确定位 .... 117 8.3 每课小练 ........................................ 118 8.3.1 练一练：通过四角定位扑 克牌 ............................................ 118 8.3.2 试一试：使用position 位置属性实 现叠放层的应用 .......................120 8.3.3 常见问题Q＆A ..........................121 8.4 理论习题 ........................................121 第9 课 CSS+DIV 固定宽度的页面 布局 123 9.1 float 左右布局 ................................124 9.2 float 左中右布局 ............................125 9.3 position 弹性左中右布局 ..............126 9.4 固定宽度的混合布局 ....................128 9.5 网页制作的“3O”原则 ...............129 9.6 每课小练 ........................................129 9.6.1 练一练：float 左右布局基本 框架 ............................................129 9.6.2 练一练：使用float 属性与position 位置属性进行固定宽度混合布局 ....................................................131 9.6.3 学以致用：简化版杭州19 楼 网页 ............................................132 9.6.4 常见问题Q＆A ..........................133 9.7 理论习题 ........................................134 第10 课 表单基础 136 10.1 表单与表单对象 ..........................137 10.1.1 什么是表单............... 137 10.1.2 ＜form＞ 标签 ............................137 10.1.3 表单对象 ..................................138 10.2 注册登录表单实例 ......................141 10.3 每课小练 ......................................142 10.3.1 练一练：制作简单表单网页 .142 10.3.2 学以致用：表单应用实例 ......143 10.3.3 常见问题Q＆A ........................144 10.4 理论习题 ......................................144 第11 课 JavaScript 基本应用 146 11.1 什么是JavaScript.........................147 11.2 JavaScript 的应用方法.................147 11.2.1 JavaScript 基本语法 ................147 11.2.2 最简单的JavaScript 程序（Say Hello!） ...................................149 11.2.3 表单数据验证 ..........................150 11.2.4 常用的JavaScript 对象与方法 151 11.2.5 定时器函数 ..............................154 11.3 每课小练 ......................................154 11.3.1 练一练：简单时钟网页实例 ..154 11.3.2 学以致用：制作考生登录 表单 ..........................................157 11.3.3 试一试：JavaScript 漂浮层的应用 实例..........................................158 11.3.4 常见问题Q＆A ........................160 11.4 理论习题 ......................................160 第12 课 jQuery 特效 162 12.1 jQuery 简介 ..................................163 12.1.1 什么是jQuery .........................163 12.1.2 jQuery 库文件的下载与引用..164 12.2 jQuery 文件就绪事件 .................165 12.3 jQuery 选择器及其操作 .............165 12.4 jQuery 常见特效 .........................166 12.4.1 最简单的例子——点一点就 消失 ..........................................166 12.4.2 使用slideToggle() 方法控制面板 展开或收起..............................167 12.4.3 使用animate() 动画实现页面上下 滚动 .........................................168 12.5 每课小练 ......................................169 12.5.1 练一练：鼠标悬停切换图像 特效 ...........................................170 12.5.2 学以致用：jQuery 轮播特效 实例 ..........................................172 12.5.3 常见问题Q＆A ........................177 12.6 理论习题 ......................................177 第13 课 固定宽度网页实例 179 13.1 IHangzhou 网页 ...........................180 13.2 杭州19 楼综合页面 ...................180 13.3 杭州亚运新闻网页 ......................181 13.4 每课小练 ......................................183 13.4.1 练一练：页面布局分析与 重现 ..........................................183 13.4.2 学以致用：开发创意网站 ......183 13.4.3 常见问题Q＆A ........................184 13.5 理论习题 ......................................184 第14 课 响应式设计基础 185 14.1 响应式网站概述 ..........................186 14.1.1 最简单的响应式设计CSS 样式 代码 ..........................................186 14.1.2 视口 ..........................................186 14.1.3 响应式技术支持 ......................187 14.2 媒体查询与断点 .........................187 14.2.1 媒体查询的语法规则 ..............187 14.2.2 断点与多段响应式 ..................188 14.2.3 断点取值 ..................................189 14.3 弹性布局 ......................................189 14.4 响应式左右布局 ..........................191 14.5 每课小练 ......................................192 14.5.1 练一练：两段响应式布局 ......192 14.5.2 学以致用：制作响应式IPanda 网页 ..........................................194 14.5.3 常见问题Q＆A ........................196 14.6 理论习题 ......................................196 第15 课 响应式设计特点及应用 198 15.1 响应式设计特点 .........................199 15.1.1 设计原则 ..................................199 15.1.2 响应式设计考虑要点 ..............199 15.1.3 弹性布局 ..................................200 15.2 多段响应式布局实例 ..................201 15.3 网页中的图像 ..............................204 15.3.1 弹性图像 ..................................204 15.3.2 常见的网页图像文件类型 ......205 15.3.3 图像拼合技术 ..........................207 15.3.4 字体图标 ..................................207 15.4 网页字体 ......................................208 15.4.1 衬线体与非衬线体 ..................208 15.4.2 使用@font-face 功能设置 字体 ..........................................208 15.5 每课小练 ......................................209 15.5.1 练一练：三段响应式布局 练习 ..........................................209 15.5.2 试一试：制作三段响应式Oscar 网页..........................................210 15.6 理论习题 .....................................214 第16 课 Flexbox 伸缩盒 216 16.1 什么是Flexbox 伸缩盒 ...............217 16.2 常用的Flexbox 伸缩盒属性 .......217 16.3 每课小练 ......................................219 16.3.1 练一练：Flexbox 伸缩盒网页 练习 ..........................................219 16.3.2 试一试：将Flexbox 伸缩盒用于 响应式布局..............................220 16.3.3 常见问题Q＆A ........................223 16.4 理论习题 ......................................223 第17 课 网站建设概述 225 17.1 网站建设过程与规范 ..................226 17.2 什么是自建站 ..............................226 17.3 网站重构 ......................................226 17.4 网站建设项目需求 ......................227 17.5 网站文件管理 ..............................227 17.6 每课小练 ......................................228 17.6.1 学以致用：网站建设实践 ......228 17.6.2 常见问题Q＆A ........................233 17.7 理论习题 ......................................234 第18 课 HTML5 的API 235 18.1 什么是API ...................................236 18.2 ＜canvas＞ 绘图 ..............................236 18.2.1 什么是网页Canvas 画布 ........236 18.2.2 Canvas 绘图实例 .....................237 18.3 音乐播放器 ..................................239 18.3.1 ＜audio＞ 标签 ...........................239 18.3.2 音乐播放器代码实现 ..............240 18.4 百度地图API 简介 ......................246 18.5 理论习题 ......................................250 附录 251
我要评论
|
