【推荐语】
本书由浅入深,、系统、详尽地介绍了Bootstrap框架相关技术在Web和移动Web开发领域的应用。书了大量的代码示例,读者可以通过这些示例深入理解Bootstrap框架相关的知识点,同时还可以举一反三,将这些示例应用到实战项目之中。本书从基本原理到实战应用,几乎涉及了Bootstrap框架Web开发领域的绝大部分内容,是一本集理论与实战的综合参考书。;
【目录】
目 ?录
第pan style="font-family: 宋体;">章 ?Bootstrap从何而来 pan>
1.1 ?初识Bootstrap pan>
1.2 ?什么是响应式设计 2
1.3 ?响应式设计四大原则 3
1.3.1 ?移动优先还是PC优先 3
1.3.2 ?内容流 4
1.3.3 ?位图还是矢量图 4
1.3.4 ?相对单位还是固定单位 5
1.4 ?Bootstrap设计目标 5
1.4.1 ?优先针对移动设备 5
1.4.2 ?浏览器支持 6
1.4.3 ?响应式设计 6
1.5 ?本章小结 6
第2章 ?Bootstrap开发环境 7
2.1 ?Bootstrap开发环境概述 7
2.1.1 ?下载Bootstrap开 7
2.1.2 ?Bootstrap开目录结构 9
2.1.3 ?在网站中使用Bootstrap框架 10
2.2 ?调用Bootstrap样式 1pan>
2.3 ?调用Bootstrap组件 14
2.4 ?调用Bootstrap JS 16
2.5 ?实战:一个Bootstrap实现的响应式页面 17
2.6 ?本章小结 19
第3章 ?Bootstrap脚手架
3.1 ?Bootstrap全局样式
3.1.1 ?什么是全局样式
3.1.2 ?基于HTML5文档类型
3.1.3 ?屏幕、排版与链接 2pan>
3.1.4 ?用Normalize重置样式 22
3.2 ?栅格系统 22
3.2.1 ?默认栅格系统 22
3.2.2 ?流式栅格系统 26
3.3 ?页面布局 29
3.3.1 ?固定布局 29
3.3.2 ?流式布局 30
3.4 ?响应式设计 30
3.4.1 ?启用响应式特 30
3.4.2 ?响应式Bootstrap特点 3pan>
3.4.3 ?Bootstrap支持的设备 3pan>
3.4.4 ?响应式布局辅助类 32
3.4.5 ?如何应用响应式布局 32
3.5 ?本章小结 32
第4章 ?Bootstrap样式设计 33
4.1 ?Bootstrap排版 33
4.1.1 ?标题 33
4.1.2 ?页面主体 36
4.1.3 ?强调 37
4.1.4 ?缩略语 39
4.1.5 ?地址 40
4.1.6 ?引用 40
4.1.7 ?列表 42
4.1.8 ?描述 45
4.1.9 ?代码 47
4.2 ?Bootstrap表格 49
4.2.1 ?默认样式表格 49
4.2.2 ?斑马纹样式表格 5pan>
4.2.3 ?圆角边框样式表格 52
4.2.4 ?鼠标悬停样式表格 53
4.2.5 ?带行属样式表格 55
4.3 ?Bootstrap按钮 56
4.3.1 ?默认样式按钮 56
4.3.2 ?按钮大小样式 58
4.3.3 ?特殊样式按钮 59
4.4 ?Bootstrap图片 6pan>
4.5 ?本章小结 6pan>
第5章 ?Bootstrap组件设计 62
5.1 ?Bootstrap下拉菜单 62
5.1.1 ?标签 62
5.1.2 ?对齐方式 63
5.1.3 ?禁用 64
5.1.4 ?子下拉菜单 65
5.2 ?Bootstrap按钮组 69
5.2.1 ?基本按钮组 69
5.2.2 ?工具栏按钮组 69
5.2.3 ?垂直按钮组 7pan>
5.3 ?Bootstrap按钮式下拉菜单 7pan>
5.4 ?Bootstrap导航 75
5.4.1 ?默认标签导航 75
5.4.2 ?pills标签导航 76
5.4.3 ?堆叠式标签导航 76
5.4.4 ?下拉菜单式标签导航 77
5.4.5 ?导航列表 78
5.4.6 ?标签页式导航 80
5.5 ?Bootstrap导航条 8pan>
5.5.1 ?默认样式导航条 8pan>
5.5.2 ?导航条表单 82
5.5.3 ?响应式导航条 84
5.6 ?Bootstrap分页 86
5.6.1 ?标准分页方式 86
5.6.2 ?翻页分页方式 87
5.7 ?Bootstrap标签与徽章 88
5.8 ?Bootstrap89
5.8.1 ?基本样度条 89
5.8.2 ?斜条纹样度条 90
5.8.3 ?堆叠样度条 9pan>
5.9 ?Glyphicons字体图标 92
5.10 ?本章小结 93
?
第6章 ?Bootstrap插件设计 94
6.1 ?Bootstrap插件概述 94
6.1.1 ?单个或引入 94
6.1.2 ?data属 95
6.1.3 ?事件 95
6.2 ?Bootstrap模态对话框 95
6.2.1 ?模态对话框说明 96
6.2.2 ?静态模态对话框 96
6.2.3 ?动态模态对话框 97
6.3 ?Bootstrap下拉菜单(版) 100
6.4 ?Bootstrap滚动监听 103
6.5 ?Bootstrap可切换式标签页 106
6.6 ?Bootstrap提示框 109
6.6.1 ?工具提示框 109
6.6.2 ?弹出框 112
6.6.3 ?警告框 116
6.7 ?Bootstrap按钮 117
6.7.1 ?状态按钮 118
6.7.2 ?复选按钮 119
6.7.3 ?单选按钮 1
6.8 ?Bootstrap折叠 122
6.9 ?Bootstrap幻灯 125
6.10 ?本章小结 126
第7章 ?Bootstrap响应式多媒体 127
7.1 ?Bootstrap图标的响应式 127
7.2 ?Bootstrap图像的响应式 129
7.2.1 ?可适配的图像 129
7.2.2 ?图像网格 13pan>
7.3 ?Bootstrap的响应式 137
7.4 ?本章小结 137
第8章 ?Bootstrap扁平化风格页面 138
8.1 ?扁平化设计概述 138
8.1.1 ?介绍 138
8.1.2 ?设计理念 139
8.1.3 ?页面架构 139
8.2 ?页眉设计 14pan>
8.2.1 ?导航条 14pan>
8.2.2 ?导航条图标 14pan>
8.2.3 ?导航能菜单 143
8.2.4 ?页眉标题 147
8.3 ?左侧导航设计 148
8.4 ?页面主体设计 15pan>
8.4.1 ?图片列表 15pan>
8.4.2 ?提交表单 153
8.4.3 ?文本列表 156
8.5 ?页脚设计 158
8.6 ?本章小结 159
第9章 ?Bootstrap图片幻灯页面 160
9.1 ?图片幻灯风格页面设计概述 160
9.2 ?页眉设计 16pan>
9.3 ?页面主体设计 163
9.3.1 ?图片幻灯 163
9.3.2 ?图标列表 166
9.3.3 ?图片特辑 167
9.4 ?本章小结 168
第pan style="font-family: 宋体;">章 ?Bootstrap风格按钮 169
10.1 ?风格按钮设计概述 169
10.2 ?形状与尺风格按钮 170
10.3 ?边框风格按钮 172
10.4 ?下拉菜单风格按钮 174
10.5 ?按钮组风格 176
10.6 ?本章小结 177
第pan style="font-family: 宋体;">章 ?Bootstrap响应式表格设计 178
11.1 ?表格设计概述 178
11.2 ?Bootstrap基本表格 180
11.3 ?Bootstrap数组表格 182
11.4 ?Bootstrap Ajax表格 183
11.5 ?本章小结 185
?
第pan style="font-family: 宋体;">章 ?Bootstrap响应式图表设计 186
12.1 ?图表设计概述 186
12.2 ?柱状图图表 188
12.3 ?折线图图表 190
12.4 ?饼状图图表 195
12.5 ?本章小结 198
第pan style="font-family: 宋体;">章 ?jQuery UI Bootstrap工具 199
13.1 ?jQuery UI Bootstrap工具概述 199
13.1.1 ?jQuery UI工具 199
13.1.2 ?jQuery UI Bootstrap工具 0
13.1.3 ?jQuery UI Bootstrap应用 0
13.2 ?按钮(Button) pan>
13.2.1 ?基本样式按钮 2
13.2.2 ?Set样式按钮 3
13.2.3 ?工具条样式按钮 5
13.3 ?折叠面板(Accordion) 6
13.4 ?对话框(Dialog) 9
13.4.1 ?非模态对话框 9
13.4.2 ?模态对话框 21pan>
13.5 ?标签页(Tabs) 214
13.5.1 ?基本样式标签页 214
13.5.2 ?可编辑样式标签页 217
13.6 ?Overlay与Shadow 223
13.7 ?Highlight与Error 224
13.8 ?日期选择器(Datepicker) 226
13.9 ?滑块(Slider) 227
13.9.1 ?水平滑块(Horizontal Slider) 227
13.9.2 ?垂直滑块(Vertical Slider) 228
13.10 ?自动完成(Autocomplete) 230
13.11 ?下拉菜单(Menu) 232
13.12 ?提示信息(Tooltip) 234
13.13 ?微调按钮(Spinner) 236
13.14 ?本章小结 239
第pan style="font-family: 宋体;">章 ?jQuery Mobile 框架与Bootstrap主题风格 240
14.1 ?jQuery Mobile Bootstrap概述 240
14.1.1 ?jQuery Mobile框架 240
14.1.2 ?Bootstrap主题风格 24pan>
14.1.3 ?应用开发基础 24pan>
14.2 ?主页设计 243
14.3 ?按钮设计 245
14.4 ?列表设计 248
14.5 ?导航设计 25pan>
14.6 ?表单设计 255
14.6.1 ?输入框 255
14.6.2 ?滑块 258
14.6.3 ?切换开关 260
14.6.4 ?复选框 262
14.6.5 ?单选框 264
14.6.6 ?下拉菜单 267
14.6.7 ?提交按钮 269
14.7 ?本章小结 273
第pan style="font-family: 宋体;">章 ?实战:应用Bootstrap实现一个贴吧管理页面 274
15.1 ?项目设计概述 274
15.2 ?页面布局设计 275
15.2.1 ?引入Bootstrap框架 275
15.2.2 ?实现页面布局代码 276
15.3 ?页面导航栏设计 277
15.3.1 ?构建导航的整体架构 277
15.3.2 ?设计标题和导航链接 278
15.3.3 ?设计搜索框和通知系统 279
15.3.4 ?设计管理员登录系统 280
15.3.5 ?设计响应式导航 282
15.4 ?左侧边栏设计 284
15.5 ?页面主体设计 285
15.5.1 ?页面主能的头部 286
15.5.2 ?页面主能的帖子列表 287
15.6 ?本章小结 290
附录 ?CSS选择器速览 29pan>
返回顶部