内容简介
本书依据部分“双高”院校的《Web前端技术课程教学标准》,并依据1+X证书《Web前端开发职业技能等级标准(初级)》编写,内括HTML5、CSS3、Javascript、jQuery开发技术基础和典型HTML5网站开发综合案例。本书以模块化的结构来组织章节,以“爱装”网站的开发为主线,通过对模块中每个任务相应知识点的讲解,引导读者学b前端开发的基本知识,熟悉项目开发、测试的完整流程。 本书适合作为高职高专院校Web前端技术课程、网页设计与制作课程的教材,也可作为1+X证书《Web前端开发职业技能等级标准(初级)》的考书。
目录
目录 前言第1章 HTML5概述1.1 Web简介1.1.1 和浏览器的基本概念1.1.2 URL1.1.3 超文本1.1.4 超文本标记语言HTML1.1.5 1.2 Web标准1.2.1 什么是Web标准1.2.2 理解表现和结构相分离1.3 HTML简介1.3.1 Web技术发展历程1.3.2 HTML5的特1.3.3 HTML5元素1.4 HTML5的基本结构1.4.1 HTML5语法结构1.4.2 HTML5编写规范1.4.3 HTML5文档结构1.5 创建HTML文件1.6 支持HTML5的浏览器第2章 HTML5基础2.1 head元素2.1.1 页面标题标签2.1.2 元信息标签2.1.3 关联标签2.1.4 脚本标签cript>2.2 文本元素2.2.1 标题文字标签2.2.2 特殊符号2.3 文本层次语义元素2.3.1 时间和日期标签2.3.2 标记标签2.3.3 引用标签2.4 基本排版元素2.4.1 段落标签
2.4.2 换行标签2.4.3 预格式化标签2.4.4 缩排标签2.4.5 线标签2.4.6 案例—制作爱装品牌简介页面2.5 列表元素2.5.1 无序列表2.5.2 有序列表2.5.3 定义列表2.5.4 嵌套列表2.6 图像元素2.6.1 网页图像的常用格式2.6.2 图像标签2.6.3 设置网页背景图像2.6.4 图文混排2.6.5 案例—制作爱装经营模式图文简介页面2.7 超链接2.7.1 超链接概述2.7.2 超链接的应用2.7.3 案例—制作爱装下载专区页面2.8 div元素2.9 span元素2.9.1 基本语法2.9.2 与标签的区别2.9.3 使用和标签布局网页内容第3章 HTML5页面的布局与交互3.1 使用结构标签构建网页布局3.1.1 区段标签3.1.2 导航标签3.1.3 页眉标签3.1.4 页脚标签3.1.5 独立内容标签rticle>3.1.6 附属信息标签side>3.1.7 分组标签3.1.8 案例—制作爱装新品发布页面3.2 页面交互元素3.2.1 标签和标签3.2.2 标签3.3 表格3.3.1 表格的结构3.3.2 表格的基本语法3.3.3 表格的属3.3.4 不规范表格3.3.5 表格数据的分组3.3.6 案例—使用表格布局爱装产品展示页面3.4 表单3.4.1 表单的基本概念3.4.2 表单标签3.4.3 表单元素3.4.4 案例—制作爱装会员注册表单3.4.5 表单分组3.4.6 使用表格布局表单3.4.7 表单的用法第4章 CSS3基础4.1 CSS简介4.1.1 什么是CSS4.1.2 CSS的开发环境4.1.3 CSS编写规则4.2 CSS的引用方法4.2.1 定义行内样式4.2.2 定义内部样式表4.2.3 链入外部样式表4.2.4 导入外部样式表4.3 CSS语法基础4.3.1 CSS样式规则4.3.2 基本选择符4.3.3 复合选择符4.3.4 通配符选择符4.3.5 特殊选择符4.4 CSS的属单位4.4.1 长度单位和百分比单位4.4.2 色彩单位4.5 文档结构4.5.1 文档结构的基本概念4.5.2 继承4.5.3 样式表的层叠、特殊与重要4.5.4 元素类型4.5.5 案例—制作爱装新闻更新局部页面第5章 CSS盒模型5.1 盒模型概述5.2 盒模型的属5.2.1 边框5.2.2 外边距5.2.3 内边距5.2.4 案例—盒模型属之间的关系5.3 盒模型的大小5.3.1 盒模型的宽度与高度5.3.2 设置块级元素与行级元素的宽度和高度5.4 盒子的定位5.4.1 定位属5.4.2 定位方式5.5 浮动与清除浮动5.5.1 浮动5.5.2 清除浮动5.5.3 案例—爱装登录页面的整体布局第6章 使用CSS美化页面6.1 设置字体样式6.1.1 字体类型6.1.2 字体大小6.1.3 字体粗细6.1.4 字体倾斜6.1.5 设置字体样式综合案例6.2 设置文本样式6.2.1 文本对齐方式6.2.2 行高6.2.3 文本的修饰6.2.4 段落首行6.2.5 首字下沉6.2.6 文本的截断6.2.7 文本的颜色6.2.8 文本的背景颜色6.2.9 设置文本样式综合案例6.3 设置图像样式6.3.1 图像缩放6.3.2 图像边框6.3.3 图像的不透明度6.3.4 背景图像6.3.5 背景重复6.3.6 背景图像大小6.4 设置表格样式6.4.1 常用的CSS表格属6.4.2 案例—使用斑马线表格制装项目年度排行榜6.5 设置表单样式6.5.1 使用CSS修饰常用的表单元素6.5.2 案例—制作爱装用户调查页面6.6 设置超链接样式6.6.1 设置文字超链接的外观6.6.2 设置图文超链接的外观6.7 设置列表6.7.1 表格布局的缺点6.7.2 列表布局的优势6.7.3 CSS列表属6.7.4 案例—制作爱装二维码名片6.8 创建导航菜单6.8.1 纵向导航菜单6.8.2 横向导航菜单第7章 使用CSS布局页面7.1 Div+CSS布局技术概述7.1.1 认识Div+CSS布局7.1.2 正确理解Web标准7.2 Div的嵌套布局7.2.1 将页面用Div分块7.2.2 案例—制作爱装活动发布页面7.3 常见的CSS布局样式7.3.1 两列布局样式7.3.2 三列布局样式7.4 综合案例—制作爱心社区页面7.4.1 页面布局规划7.4.2 页面的制作过程第8章 Javascript语言基础8.1 Javascript简介8.2 在网页中插入Javascript的方法8.2.1 在HTML文档中嵌入脚本程序8.2.2 链接脚本文件8.2.3 在HTML标签内添加脚本8.3 Javascript的基本数据类型和表达式8.3.1 基本数据类型8.3.2 常量8.3.3 变量8.3.4 运算符和表达式8.4 Javascript的程序结构8.4.1 简单语句8.4.2 程序控制流程8.5 函数8.5.1 函数的定义8.5.2 函数的调用8.5.3 全局变量与局部变量8.6 基于对象的Javascript语言8.6.1 对象8.6.2 对象的属8.6.3 对象的事件8.6.4 对象的方法8.7 Javascript的内置对象8.7.1 数组对象8.7.2 字符串对象8.7.3 日期对象8.8 自定义对象第9章 DOM对象及编程9.1 DOM模型9.2 window对象9.2.1 window对象的属9.2.2 window对象的方法9.3 document对象9.3.1 document对象的属9.3.2 document对象的方法9.4 location对象9.4.1 location对象的属9.4.2 location对象的方法9.5 history对象9.6 form对象9.6.1 form对象的属9.6.2 form对象的方法9.7 Javascript的对象事件处理程序9.7.1 对象的事件9.7.2 常用的事件及处理9.7.3 表单对象与交互9.7.4 案例—使用form对象实现Web页面信息交互第10章 使用Javascript制作网页10.1 文字10.1.1 制作颜色变换的欢迎词10.1.2 打字效果10.2 菜单与选项卡10.2.1 制作爱装导航菜单10.2.2 制作Tab选项卡切换效果10.3 广告0第11章 HTML5的多媒体播放和绘图11.1 多媒体播放11.1.1 HTML5的多媒体支持11.1.2 音频标签11.1.3 标签11.1.4 HTML5多媒体API11.2 Canvas绘图11.2.1 创建canvas元素11.2.2 构建绘图环境11.2.3 通过Javascript绘制图形1第12章 jQuery基础12.1 jQuery概述12.2 编写jQuery程序12.2.1 下载与配置jQuery12.2.2 编写一个简单的jQuery程序12.3 jQuery对象和DOM对象12.3.1 jQuery对象和DOM对象简介12.3.2 jQuery对象和DOM对象的相互转换12.4 jQuery插件12.4.1 下载jQuery插件12.4.2 引用jQuery插件的方法12.5 jQuery选择器12.5.1 jQuery的工厂函数12.5.2 jQuery选择器定义12.6 基础选择器12.6.1 ID选择器12.6.2 元素选择器12.6.3 类名选择器12.6.4 复合选择器12.6.5 通配符选择器12.7 层次选择器12.7.1 ancestor descendant选择器12.7.2 parent>child选择器12.7.3 prev+next选择器12.7.4 prev~lings选择器12.8 过滤选择器12.8.1 简单过滤器12.8.2 内容过滤器12.8.3 可见过滤器12.8.4 子元素过滤器12.9 表单选择器2第13章 jQuery动画与UI插件13.1 jQuery的动画方法13.2 显示与隐藏效果13.2.1 隐藏元素的方法13.2.2 显示元素的方法13.3 淡入淡出效果13.3.1 淡入效果13.3.2 淡出效果13.3.3 元素的不透明效果13.3.4 交替淡入淡出效果13.4 滑动效果13.4.1 向下展开效果13.4.2 向上收缩效果13.4.3 交替伸缩效果13.5 jQuery UI概述13.5.1 jQuery UI简介13.5.2 jQuery UI的下载13.5.3 jQuery UI的使用13.5.4 jQuery UI的工作原理13.6 jQuery UI的常用插件13.6.1 折叠面板插件13.6.2 日期选择器插件13.6.3 标签页插件3第14章 爱装网站开发综合案例14.1 网站的开发流程14.2 网站结构14.2.1 创建站点目录14.2.2 网站页面的组成14.3 网站技术分析14.4 制作首页4参考文献