本书以Bootstrap 4.4.1为蓝本,由浅入深、循序渐进地讲述了Bootstrap的基础知识、体系结构、版式、组件和插件及各种应用技能。本书共9章,内容包括:Bootstrap使用基础(第1章),使用Bootstrap布局(第2章),使用Bootstrap版式(第3章),使用Bootstrap通用样式(第4章),使用Bootstrap组件(第5章~第7章),使用jQuery插件(第8章和第9章)。 本书坚持"以就业为导向、以能力为本位”的原则,突出实用性、适用性和先进性,结构合理、论述准确、内容翔实,注意知识的层次性和技能培养的渐进性,遵循难点分散的原则合理安排各章的内容,降低学生的学习难度,通过丰富的实例来引导学习者学习,旨在培养他们的实践动手能力和创新精神。每章后面均配习题和上机操作。 本书可作为职业院校计算机类专业的教材,也可作为网页设计人员、Web前端开发人员的参考书。

第1章 Bootstrap使用基础 1 1.1 Bootstrap概述 1 1.1.1 Bootstrap的发展 1 1.1.2 Bootstrap的版本 2 1.1.3 浏览器支持 3 1.2 理解媒体查询 4 1.2.1 媒体查询的语法格式 4 1.2.2 媒体查询的常用方式 5 1.3 使用Sass语言 10 1.3.1 安装Sass 10 1.3.2 使用变量 12 1.3.3 嵌套CSS规则 13 1.3.4 导入Sass文件 17 1.3.5 使用混合器 20 1.3.6 使用选择器继承 22 1.4 使用Bootstrap 23 1.4.1 下载和安装Bootstrap 23 1.4.2 Bootstrap开发工具 25 1.4.3 Bootstrap起始模板 26 习题1 28 第2章 使用Bootstrap布局 29 2.1 布局基础知识 29 2.1.1 包装容器 29 2.1.2 响应断点 33 2.1.3 堆叠顺序 33 2.2 创建网格系统 34 2.2.1 工作原理 34 2.2.2 基本网格 36 2.2.3 响应网格 40 2.2.4 对齐方式 47 2.2.5 重新排序 51 2.2.6 列的嵌套 56 2.3 了解布局工具类 57 习题2 57 第3章 使用Bootstrap版式 59 3.1 CSS初始设置 59 3.1.1 页面默认设置 59 3.1.2 常用元素设置 60 3.2 文档排版 62 3.2.1 全局设置 62 3.2.2 设置标题 62 3.2.3 使用段落 64 3.2.4 内联文本元素 65 3.2.5 使用缩略语 66 3.2.6 引用内容 67 3.2.7 使用摘要 68 3.2.8 使用列表 69 3.3 代码排版 72 3.3.1 内联代码与代码块 72 3.3.2 变量、输入和输出 74 3.4 图片排版 74 3.4.1 响应式图片 74 3.4.2 图像缩略图 75 3.4.3 图片对齐处理 76 3.4.4 使用picture元素 77 3.4.5 创建图文框 78 3.5 表格排版 79 3.5.1 创建基本表格 79 3.5.2 设置表头 80 3.5.3 设置条纹行效果 82 3.5.4 设置表格边框 84 3.5.5 设置悬停行效果 85 3.5.6 创建紧凑表格 87 3.5.7 表格着色 88 习题3 90 第4章 使用Bootstrap通用样式 92 4.1 文本处理 92 4.1.1 设置文本对齐方式 92 4.1.2 换行和溢出 94 4.1.3 字母大小写转换 95 4.1.4 字体粗细和倾斜 96 4.1.5 处理链接文本 97 4.2 设置颜色 98 4.2.1 设置文本颜色 98 4.2.2 设置背景颜色 100 4.2.3 设置渐变色背景 101 4.3 设置边框和阴影 103 4.3.1 添加或移除边框 103 4.3.2 设置边框颜色 105 4.3.3 设置边框半径 106 4.3.4 设置阴影效果 107 4.4 设置大小和边距 108 4.4.1 设置元素大小 109 4.4.2 设置边距 111 4.5 设置浮动和定位 114 4.5.1 实现浮动方式 114 4.5.2 设置定位方式 115 4.5.3 设置溢出方式 117 4.5.4 处理嵌入内容 118 4.6 设置弹性盒布局 119 4.6.1 设置显示方式 119 4.6.2 创建弹性盒布局 122 4.6.3 设置项目对齐方式 124 4.6.4 设置项目宽度 127 4.6.5 设置自动边距 128 4.6.6 设置换行方式 130 4.6.7 设置项目顺序 132 4.6.8 对齐内容 133 4.7 使用其他样式 135 4.7.1 设置垂直对齐方式 135 4.7.2 创建延伸链接 137 4.7.3 定义关闭图标 138 习题4 139 第5章 使用Bootstrap组件(上) 141 5.1 使用按钮 141 5.1.1 创建基本按钮 141 5.1.2 设置按钮背景颜色 142 5.1.3 设置按钮轮廓颜色 143 5.1.4 设置按钮大小 144 5.1.5 设置按钮状态 145 5.2 使用按钮组 146 5.2.1 创建基本按钮组 146 5.2.2 设置按钮组大小 147 5.2.3 创建按钮工具栏 148 5.2.4 使用嵌套按钮组 150 5.2.5 垂直排列按钮组 151 5.3 使用下拉菜单 152 5.3.1 创建单一按钮下拉菜单 152 5.3.2 创建分割按钮下拉菜单 155 5.3.3 设置下拉按钮大小 158 5.3.4 设置菜单展开方向 159 5.3.5 设置下拉菜单偏移 160 5.3.6 设置菜单对齐方式 161 5.3.7 设置菜单项状态 162 5.3.8 添加更多菜单内容 163 5.4 使用导航组件 164 5.4.1 创建基本导航组件 165 5.4.2 设置导航对齐方式 166 5.4.3 创建垂直布局导航 167 5.4.4 创建选项卡式导航 168 5.4.5 创建胶囊式导航 169 5.4.6 设置填充和对齐 170 5.4.7 创建选项卡内容区域 172 习题5 174 第6章 使用Bootstrap组件(中) 176 6.1 使用警告框 176 6.1.1 创建警告框 176 6.1.2 添加更多内容 177 6.1.3 添加关闭功能 178 6.2 使用徽章 179 6.2.1 创建徽章组件 179 6.2.2 设置徽章颜色 181 6.2.3 创建椭圆形徽章 181 6.2.4 创建链接徽章 182 6.3 使用媒体对象 183 6.3.1 创建媒体对象 183 6.3.2 创建嵌套媒体对象 184 6.3.3 设置媒体对齐方式 185 6.3.4 设置内容排列顺序 186 6.3.5 创建媒体对象列表 187 6.4 使用超大屏幕 188 6.4.1 创建超大屏幕 188 6.4.2 设置超大屏幕风格 189 6.5 使用表单 190 6.5.1 定义表单控件 190 6.5.2 使用复选框和单选按钮 194 6.5.3 设置表单组 197 6.5.4 创建网格表单 198 6.5.5 创建内联表单 203 6.5.6 使用帮助文本 204 6.5.7 禁用表单 205 6.6 使用输入组 206 6.6.1 创建基本输入组 206 6.6.2 设置输入组尺寸 208 6.6.3 组合复选框或单选按钮 209 6.6.4 多项输入组合 210 6.6.5 多类型控件组合 211 习题6 212 第7章 使用Bootstrap组件(下) 214 7.1 使用进度条 214 7.1.1 创建进度条 214 7.1.2 设置进度条样式 215 7.1.3 设置进度条风格 217 7.2 使用导航栏 220 7.2.1 创建导航栏 220 7.2.2 设置导航栏配色方案 222 7.2.3 设置导航栏定位方式 223 7.3 使用列表组 225 7.3.1 创建基本列表组 225 7.3.2 创建水平列表组 226 7.3.3 设置列表组样式 227 7.3.4 定制列表组内容 229 7.4 使用面包屑 232 7.4.1 创建面包屑 232 7.4.2 设置分隔符 233 7.5 使用分页 234 7.5.1 创建分页组件 234 7.5.2 在分页中使用图标 235 7.5.3 设置分页大小 236 7.5.4 设置分页对齐方式 237 7.6 使用加载指示器 238 7.6.1 创建加载指示器 238 7.6.2 设置加载指示器样式 239 7.6.3 加载指示器按钮 241 7.7 使用卡片 242 7.7.1 创建基本卡片组件 242 7.7.2 卡片的内容类型 243 7.7.3 在卡片中添加导航 244 7.7.4 在卡片中添加图片 245 7.7.5 设置卡片样式 247 7.7.6 设置卡片布局 248 习题7 253 第8章 使用jQuery插件(上) 255 8.1 插件基础 255 8.1.1 插件分类 255 8.1.2 安装插件 256 8.1.3 调用插件 256 8.1.4 选项、方法和事件 257 8.2 使用按钮插件 258 8.2.1 切换按钮状态 258 8.2.2 单选按钮与复选按钮 259 8.3 使用工具提示插件 260 8.3.1 创建工具提示插件 260 8.3.2 调用工具提示插件 261 8.3.3 处理工具提示事件 263 8.4 使用弹出框插件 264 8.4.1 创建弹出框插件 264 8.4.2 调用弹出框插件 266 8.4.3 处理弹出框事件 268 8.5 使用警告框插件 269 8.5.1 关闭警告框 269 8.5.2 处理警告框事件 272 8.6 使用模态框插件 273 8.6.1 创建模态框插件 273 8.6.2 设置模态框 对齐方式和尺寸 275 8.6.3 调用模态框插件 277 8.6.4 处理模态框事件 279 8.7 使用折叠插件 281 8.7.1 创建折叠插件 281 8.7.2 控制多个目标 282 8.7.3 实现手风琴效果 283 8.7.4 调用折叠插件 285 8.7.5 处理折叠事件 287 习题8 288 第9章 使用jQuery插件(下) 290 9.1 使用下拉菜单插件 290 9.1.1 调用下拉菜单插件 290 9.1.2 处理下拉菜单事件 293 9.2 使用选项卡插件 295 9.2.1 创建选项卡插件 295 9.2.2 调用选项卡插件 296 9.2.3 处理选项卡事件 299 9.3 使用提示框插件 301 9.3.1 创建提示框插件 301 9.3.2 设置提示框的位置 305 9.3.3 调用提示框插件 306 9.3.4 处理提示框事件 308 9.4 使用轮播插件 309 9.4.1 创建基本轮播插件 310 9.4.2 添加控制按钮和指示器 311 9.4.3 调用轮播插件 313 9.4.4 处理轮播事件 315 9.5 使用滚动监听 317 9.5.1 创建滚动监听 317 9.5.2 调用滚动监听 320 9.5.3 处理滚动监听事件 321 习题9 322