Web前端开发技术

**部分 HTML5基础知识 第1章 HTML5 基础知识 1 1.1 文档基本结构 1 1.1.1 文档结构元素 1 1.1.2 文档语义元素 2 1.1.3 行内元素和块级元素 4 1.2 文字排版 7 1.2.1 分段 7 1.2.2 换行 7 1.2.3 块引用 8 1.2.4 预定义 8 1.2.5 标题 9 1.2.6 字体 10 1.3 表单制作 11 1.3.1 表单 11 1.3.2 输入框 12 1.3.3 下拉列表和选项 18 1.3.4 文本域 19 1.3.5 数据列表 19 1.3.6 输出框 20 1.3.7 表单综合案例 21 1.4 表格和列表制作 22 1.4.1 表格 22 1.4.2 列表 26 1.5 超链接 29 1.5.1 超链接动作 29 1.5.2 创建目标锚点 29 1.6 图文混排 31 1.6.1 图像导入 31 1.6.2 页面的图文混排 32 课后习题 34 第二部分 CSS3基础知识 第2章 CSS3基础 36 2.1 CSS3 概述 36 2.1.1 CSS3的概念 36 2.1.2 CSS3的特点 37 2.1.3 CSS3的语法格式 37 2.1.4 CSS3的类型 38 2.1.5 CSS3的性质 39 2.2 选择器 41 2.2.1 元素选择器 42 2.2.2 通配符选择器 43 2.2.3 类选择器 43 2.2.4 id选择器 43 2.2.5 后代选择器 44 2.2.6 子元素选择器 44 2.2.7 相邻兄弟元素选择器 44 2.2.8 通用兄弟选择器 45 2.2.9 群组选择器 45 2.2.10 属性选择器 45 2.2.11 伪类选择器 49 2.3 盒模型 55 2.3.1 外边距 56 2.3.2 内边距 56 2.3.3 边框 57 2.3.4 圆角边框 58 2.3.5 盒子阴影 59 2.4 样式 60 2.4.1 长度单位 60 2.4.2 字体属性 61 2.4.3 常用文本属性 65 2.4.4 背景属性 69 2.4.5 列表样式 77 2.4.6 表格样式 78 2.5 定位 81 2.5.1 定位概述 81 2.5.2 四种定位 82 2.5.3 浮动 87 课后习题 90 第3章 CSS3的多彩渲染 92 3.1 变形 92 3.1.1 旋转 92 3.1.2 扭曲 93 3.1.3 缩放 94 3.1.4 平移 95 3.1.5 变形矩阵 96 3.1.6 变形原点 97 3.2 动画 98 3.2.1 过渡动画 98 3.2.2 关键帧动画 102 3.3 响应式布局 108 3.3.1 百分比布局 108 3.3.2 媒体查询布局 111 3.3.3 弹性盒布局 115 课后习题 120 第三部分 JavaScript技术 第4章 JavaScript基础知识 122 4.1 认识JavaScript 122 4.2 引入JavaScript的方法 123 4.3 JavaScript语句 125 4.3.1 JavaScript语句规则 125 4.3.2 JavaScript输出 127 4.3.3 JavaScript 注释 130 4.4 JavaScript变量 131 4.4.1 变量类型 131 4.4.2 变量作用域 133 4.5 JavaScript数据类型 133 4.6 JavaScript运算符 136 4.7 JavaScript语句类型 139 4.7.1 条件判断语句 139 4.7.2 循环语句 142 4.7.3 跳转语句 144 4.7.4 异常处理 145 课后习题 146 第5章 JavaScript对象和函数 148 5.1 JavaScript对象概述 148 5.2 JavaScript函数 150 5.3 JavaScript常用对象 152 5.3.1 数组对象 152 5.3.2 文档对象 154 5.3.3 浏览器对象模型 155 5.3.4 JSON对象 157 课后习题 159 第6章 JavaScript开发实例 160 6.1 Canvas绘图开发实例 160 6.1.1 定义Canvas标签 160 6.1.2 绘制Canvas路径 161 6.1.3 Canvas图片 164 6.1.4 Canvas开发实例——帧动画效果 166 6.2 网页数据存储Web Storage开发实例 168 6.2.1 认识Web Storage 168 6.2.2 localStorage和sessionStorage 169 6.2.3 Web Storage实例——登录页面 173 6.3 手风琴菜单开发实例 175 6.4 图片Modal(模态)效果设计 177 课后习题 180 第四部分 框架技术 第7章 jQuery技术 181 7.1 jQuery的下载和安装 181 7.2 使用jQuery进行HTML操作 183 7.2.1 jQuery选择器 184 7.2.2 jQuery元素操作 186 7.2.3 jQuery元素遍历 196 7.3 jQuery的AJAX操作 201 7.3.1 AJAX相关知识 201 7.3.2 jQuery AJAX 201 课后习题 203 第8章 Bootstrap技术 204 8.1 Bootstrap的安装使用 204 8.2 Bootstrap布局 207 8.2.1 容器 207 8.2.2 栅格系统 208 8.3 Bootstrap内容排版 211 8.3.1 文字排版样式 211 8.3.2 代码排版样式 213 8.3.3 表格排版样式 214 8.3.4 图片排版样式 215 8.4 Bootstrap组件 215 8.4.1 警告框?(Alerts) 215 8.4.2 徽章 (Badge) 216 8.4.3 面包屑导航 (Breadcrumb) 217 8.4.4 按钮(Buttons) 217 8.4.5 按钮组 (Button group) 219 8.4.6 卡片 (Card) 220 8.4.7 轮播 (Carousel) 221 8.4.8 折叠 (Collapse) 221 8.4.9 下拉菜单 (Dropdowns) 222 8.4.10 表单 (Forms) 222 8.4.11 输入组 (Input group) 223 8.4.12 巨幕 (Jumbotron) 224 8.4.13 列表组 (List group) 224 8.4.14 媒体对象 (Media object) 225 8.4.15 模态框 (Modal) 225 8.4.16 导航 (Navs) 226 8.4.17 导航条 (Navbar) 227 8.4.18 分页 (Pagination) 228 8.4.19 弹出框 (Popovers) 228 8.4.20 进度条 (Progress) 229 8.4.21 滚动监听 (Scrollspy) 230 8.4.22 旋转图标(Spinners) 232 8.4.23 轻量弹框 (Toasts) 232 8.4.24 工具提示框 (Tooltips) 233 课后习题 234 参考文献 235