Bootstrap响应式网站开发实例教程电子书

书名页

版权

前言

第1篇 Bootstrap基础

第1章 响应式网站简介

1.1 认识响应式网页布局

1.1.1 响应式网站

1.1.2 响应式网页布局的优缺点

1.1.3 响应式设计概念

1.1.4 认识视口

1.2 流式网格

1.2.1 网格设计

1.2.2 流式布局

1.3 媒体查询实现响应式布局

1.3.1 媒体查询基础

1.3.2 使用方法

1.3.3 设置方式

1.3.4 媒体类型

1.3.5 判断条件

1.3.6 媒体特征

1.4 响应式布局中的图像与字体

1.4.1 流式图像

1.4.2 字体使用

1.5 案例：体验响应式布局中的图像与字体

1.5.1 案例展示

1.5.2 案例分析

1.5.3 案例实现

1.5.4 案例拓展

1.6 习题与项目实践

第2章 Bootstrap概述

2.1 Bootstrap简介

2.1.1 初识Bootstrap

2.1.2 使用Bootstrap的优势

2.1.3 浏览器与设备支持

2.1.4 环境搭建

2.1.5 Hello World实例

2.2 Bootstrap使用基础

2.2.1 基本的Bootstrap使用模板

2.2.2 设置文档类型

2.2.3 响应式图像

2.3 案例：尝试Bootstrap布局企业导航区

2.3.1 案例展示

2.3.2 案例分析

2.3.3 案例实现

2.3.4 案例拓展

2.4 习题与项目实践

第2篇 Bootstrap框架

第3章 Bootstrap栅格系统

3.1 Bootstrap栅格系统的原理

3.1.1 栅格系统的实现原理

3.1.2 栅格系统的工作原理

3.1.3 响应式栅格

3.1.4 响应式实用工具

3.2 栅格系统的常用方法

3.2.1 移动与调整列的位置

3.2.2 调整列的排序

3.2.3 列嵌套排版

3.3 案例：企业内容展示页面制作

3.3.1 案例展示

3.3.2 案例分析

3.3.3 案例实现

3.3.4 案例拓展

3.4 习题与项目实践

第4章 Bootstrap基础布局

4.1 基础排版

4.1.1 标题

4.1.2 段落

4.1.3 文本样式

4.2 列表

4.2.1 有序列表和无序列表

4.2.2 无样式与内联列表

4.2.3 定义列表

4.3 按钮

4.3.1 预定义按钮

4.3.2 按钮尺寸

4.3.3 按钮的激活与禁用状态

4.4 其他辅助类

4.4.1 背景色

4.4.2 关闭与下拉三角符号按钮

4.4.3 快速浮动与块居中显示

4.4.4 清除浮动

4.4.5 元素的显示与隐藏

4.5 案例：招应聘信息发布

4.5.1 案例展示

4.5.2 案例分析

4.5.3 案例实现

4.5.4 案例拓展

4.6 习题与项目实践

第5章 Bootstrap表格

5.1 网页中的表格

5.1.1 表格简介

5.1.2 表格的基本元素

5.1.3 创建表格

5.2 Bootstrap中的表格

5.2.1 基本型表格

5.2.2 条纹状表格

5.2.3 带边框的表格

5.2.4 鼠标悬停表格

5.2.5 紧缩型表格

5.2.6 状态类表格

5.2.7 响应式表格

5.3 案例：商品列表数据展示

5.3.1 案例展示

5.3.2 案例分析

5.3.3 案例实现

5.3.4 案例拓展

5.4 习题与项目实践

第6章 Bootstrap表单

6.1 表单布局的类型

6.1.1 基本型表单

6.1.2 内联型表单

6.1.3 水平排列型表单

6.2 表单中控件的分类

6.2.1 Bootstrap支持的表单控件

6.2.2 静态控件

6.3 表单控件的状态

6.3.1 焦点状态

6.3.2 禁用状态

6.3.3 验证状态

6.3.4 控件尺寸

6.3.5 表单帮助文本

6.4 案例：用户信息注册页面制作

6.4.1 案例展示

6.4.2 案例分析

6.4.3 案例实现

6.4.4 案例拓展

6.5 习题与项目实践

第7章 使用Bootstrap布局组件

7.1 字体图标

7.1.1 字体图标简介

7.1.2 使用字体图标

7.2 下拉菜单

7.2.1 认识下拉菜单

7.2.2 下拉菜单的使用

7.3 按钮组

7.3.1 认识按钮组

7.3.2 设计按钮导航条

7.3.3 按钮式下拉菜单

7.4 输入框组

7.4.1 认识输入框组

7.4.2 创建输入框组

7.5 导航

7.5.1 认识导航元素

7.5.2 两端对齐导航菜单

7.5.3 禁用的链接

7.5.4 带有下拉菜单的导航

7.6 导航栏

7.6.1 认识导航栏

7.6.2 响应式导航栏

7.6.3 导航栏的其他特效

7.6.4 面包屑导航

7.7 分页

7.7.1 认识分页

7.7.2 分页类的其他辅助类

7.8 标签与徽章

7.8.1 标签的使用

7.8.2 徽章的使用

7.9 超大屏幕与缩略图

7.9.1 超大屏幕的使用

7.9.2 缩略图的使用

7.10 警告与进度条

7.10.1 警告的使用

7.10.2 进度条的使用

7.11 多媒体对象与列表组

7.11.1 多媒体对象的使用

7.11.2 列表组的使用

7.12 面板

7.12.1 标题、脚注与语境色彩面板

7.12.2 带表格与列表组的面板

7.13 案例：企业网站主页制作

7.13.1 案例展示

7.13.2 案例分析

7.13.3 案例实现

7.13.4 案例拓展

7.14 习题与项目实践

第8章 Bootstrap的JavaScript插件

8.1 Bootstrap插件概述

8.1.1 Bootstrap的JavaScript插件功能

8.1.2 引用JavaScript插件的方式

8.1.3 引用jQuery插件的方式

8.2 过渡效果与模态框

8.2.1 过渡效果简介

8.2.2 模态框的概念

8.2.3 静态模态框的使用方法

8.2.4 模态框中事件的使用

8.3 标签页

8.3.1 标签页简介

8.3.2 标签页的基本使用方法

8.3.3 标签页的JavaScript调用方法

8.4 提示工具

8.4.1 提示工具简介

8.4.2 提示工具的基本使用方法

8.5 弹出框工具

8.5.1 弹出框工具简介

8.5.2 弹出框工具的基本使用方法

8.5.3 弹出框工具的方法与事件

8.6 折叠框工具

8.6.1 折叠框工具简介

8.6.2 折叠框工具的基本使用方法

8.7 轮播工具

8.7.1 轮播工具简介

8.7.2 轮播工具的基本使用方法

8.8 案例：使用JavaScript插件布局企业网站

8.8.1 案例展示

8.8.2 案例分析

8.8.3 案例实现

8.8.4 案例拓展

8.9 习题与项目实践

第3篇 Bootstrap实战

第9章 综合项目实训

9.1 项目1：课程宣传页面

9.1.1 项目展示

9.1.2 项目分析

9.1.3 搭建基本页面框架

9.1.4 页面基本布局设计

9.1.5 左侧窗格内容设计

9.1.6 右侧窗格内容设计

9.1.7 项目拓展

9.2 项目2：企业主页页面设计制作

9.2.1 项目展示

9.2.2 项目开发流程

9.2.3 项目分析

9.2.4 搭建基本页面框架

9.2.5 顶部栏模块的分析与实现

9.2.6 导航栏模块的分析与实现

9.2.7 轮播图模块实现

9.2.8 信息和课程报名模块的分析与实现

9.2.9 产品展示模块的分析与实现

9.2.10 新闻、合作伙伴与版权模块的分析与实现

9.2.11 项目拓展

参考文献