Bootstrap教程_Bootstrap3实用教程-歪脖网

Bootstrap3实用教程

Bootstrap 是由 Mark Otto 和 Jacob Thornton 两位设计师合作开发的一个基于 HTML、CSS、JavaScript 的前端框架,它简洁灵活,使得 Web 开发更加快速、简单


第 1 章 Bootstrap基础

1.1 Bootstrap简介

1.1.1 Bootstrap是什么

1.1.2 为什么选择Bootstrap

1.1.3 Bootstrap3 的新特性

1.2 下载Bootstrap3

1.2.1 下载编译版本

1.2.2 下载源码版本

1.2.3 下载Sass版本

1.3 Bootstrap的文件结构

1.3.1 编译版本的文件结构

1.3.2 源码版本的文件结构

1.4 安装Bootstrap

1.4.1 安装编译版本

1.4.2 安装源码版本

1.5 编译Bootstrap

1.6 定制BootStrap

1.7 本地部署BootStrap

1.8 Bootstrap网页模板

第 2 章 Bootstrap全局样式

2.1 概述

2.1.1 HTML5文档类型

2.1.2 移动设备优先

2.1.3 排版和链接

2.1.4 重置样式

2.1.5 布局容器

2.2 栅格系统

2.2.1 工作原理

2.2.2 布局实例

2.2.3 列平移

2.2.4 列嵌套

2.2.5 列排序

2.2.6 mixin和变量

2.3 排版

2.3.1 标题

2.3.2 正文文本

2.3.3 行内文本

2.3.4 水平对齐

2.3.5 文本大小写

2.3.6 缩写词

2.3.7 地址

2.3.8 列表

2.4 源代码

2.4.1 行内代码

2.4.2 代码块

2.4.3 用户输入

2.4.4 变量

2.4.5 程序输出

2.5 表格

2.5.1 基本的表格

2.5.2 带条纹的表格

2.5.3 带边框的表格

2.5.4 带悬停效果的表格

2.5.5 紧凑型表格

2.5.6 表格的情景类

2.5.7 响应式表格

2.6 表单

2.6.1 基本表单

2.6.2 行内表单

2.6.3 横向表单

2.6.4 支持的控件

2.6.5 静态控件

2.6.6 帮助文本

2.6.7 控件的状态

2.6.8 控件的尺寸

2.7 按钮

2.7.1 支持的元素

2.7.2 按钮的外观

2.7.3 按钮的尺寸

2.7.4 按钮的状态

2.8 图片

2.8.1 响应式图片

2.8.2 图片的形状

2.9 辅助类

2.9.1 文本情景类

2.9.2 背景情景类

2.9.3 关闭按钮

2.9.4 三角箭头

2.9.5 快速浮动

2.9.6 让内容块居中

2.9.7 清除浮动

2.9.8 显示或隐藏内容

2.9.9 屏幕阅读器和键盘导航

2.9.10 图片替换

2.10 响应式工具类

2.10.1 响应式类

2.10.2 打印机类

2.10.3 测试用例

2.11 使用Less

2.11.1 Less变量

2.11.2 特定厂商的Mixin

2.11.3 工具Mixin

第 3 章 Bootstrap组件

3.1 Glyphicons字体图标

3.1.1 可用的图标

3.1.2 如何使用

3.1.3 使用实例

3.1.4 定制图标

3.2 下拉菜单

3.2.1 创建下拉菜单

3.2.2 右对齐的下拉菜单

3.2.3 下拉菜单标题

3.2.4 下拉菜单分隔线

3.2.5 禁用某个下拉菜单

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.5 输入框组

3.5.1 创建输入框组

3.5.2 控件的尺寸

3.5.3 可添加的元素

3.6 导航

3.6.1 创建导航

3.6.2 两端对齐的导航

3.6.3 禁用导航链接

3.6.4 带下拉的胶囊导航

3.7 导航条

3.7.1 创建导航条

3.7.2 支持的组件

3.7.3 组件的排列

3.7.4 固定导航条

3.7.5 静止导航条

3.7.6 反色导航条

3.8 面包屑导航

3.9 分页导航

3.9.1 分页组件

3.9.2 翻页组件

3.10 标签

3.11 徽章

3.12 巨幕

3.13 页头

3.14 缩略图

3.14.1 默认缩略图

3.14.2 自定义缩略图

3.14.3 缩略图列表

3.15 警告框

3.15.1 创建警告框

3.15.2 可关闭的警告框

3.15.3 警告框中的链接

3.16 进度条

3.16.1 创建进度条

3.16.2 带提示的进度条

3.16.3 进度条的颜色

3.16.4 条纹进度条

3.16.5 进度条堆叠

3.17 媒体对象

3.17.1 媒体

3.17.2 媒体列表

3.18 列表组

3.18.1 创建列表组

3.18.2 支持的组件

3.18.3 禁用和活动状态

3.18.4 情景类

3.18.5 列表组堆叠

3.19 面板

3.19.1 创建面板

3.19.2 情景类

3.19.3 带表格的面板

3.19.4 带列表组的面板

3.20 响应式内嵌元素

3.21 Well

第 4 章 Bootstrap插件

4.1 概述

4.1.1 插件的原理

4.1.2 引入插件

4.1.3 插件的调用方式

4.1.4 插件防止冲突

4.1.5 插件的选项

4.1.6 插件的事件

4.1.7 插件的版本号

4.2 过渡效果

4.2.1 使用过渡效果

4.2.2 过渡插件的内容

4.2.3 禁用过渡效果

4.3 模态对话框

4.3.1 静态模态对话框

4.3.2 动态模态对话框

4.3.3 模态对话框的尺寸

4.3.4 模态对话框的调用方式

4.3.5 模态对话框的选项

4.3.6 模态对话框的方法

4.3.7 模态对话框的事件

4.4 下拉菜单

4.4.1 下拉菜单的调用方式

4.4.2 下拉菜单的事件

4.5 滚动监听

4.5.1 滚动监听插件的使用方法

4.5.2 滚动监听插件的调用方式

4.5.3 滚动监听插件的选项

4.5.4 滚动监听插件的方法

4.5.5 滚动监听插件的事件

4.6 标签页插件

4.6.1 标签页插件的调用方式

4.6.2 标签页插件的事件

4.7 工具提示

4.7.1 工具提示插件的使用方法

4.7.2 工具提示插件的选项

4.7.3 工具提示插件的方法

4.7.4 工具提示插件的事件

4.8 弹出提示

4.8.1 弹出提示插件的使用方法

4.8.2 弹出提示插件的选项

4.8.3 弹出提示插件的方法

4.9 警告框

4.9.1 警告框插件的使用方法

4.9.2 警告框插件的事件

4.10 按钮

4.10.1 按钮状态提示

4.10.2 按钮状态切换

4.10.3 按钮组

4.11 折叠

4.11.1 折叠插件的使用方法

4.11.2 折叠插件的调用方式

4.11.3 折叠插件的选项

4.11.4 折叠插件的事件

4.12 轮番

4.12.1 轮番插件的使用方法

4.12.2 轮番插件的调用方式

4.12.3 轮番插件的选项

4.12.4 轮番插件的事件

4.13 输入提示

4.14 Affix

第 5 章 Bootstrap 第三方扩展

5.1 Font Awesome

5.1.1 简介

5.1.2 基本图标

5.1.3 图标的尺寸

5.1.4 固定宽度的图标

5.1.5 列表图标

5.1.6 带边框的图标

5.1.7 旋转或翻转图标

5.1.8 带动画的图标

5.1.9 堆叠的图标

返回顶部 手机访问 关注微信 返回底部

扫码访问歪脖网

随时随地,想看就看

关注歪脖网微信

分享 web 知识、交流 web 经验