Bootstrap Web设计与开发实战目录

时间：2023-02-23 07:06:01 | 来源：营销百科

时间：2023-02-23 07:06:01 来源：营销百科

Bootstrap Web设计与开发实战目录：第1章Bootstrap从何而来1

1.1初识Bootstrap1

1.2什么是响应式设计2

1.3响应式设计四大原则3

1.3.1移动优先还是PC优先3

1.3.2内容流4

1.3.3位图还是矢量图4

1.3.4相对单位还是固定单位5

1.4Bootstrap设计目标5

1.4.1优先针对移动设备5

1.4.2浏览器支持6

1.4.3响应式设计6

1.5本章小结6

第2章Bootstrap开发环境7

2.1Bootstrap开发环境概述7

2.1.1下载Bootstrap开发包7

2.1.2Bootstrap开发包目录结构9

2.1.3在网站中使用Bootstrap框架10

2.2调用Bootstrap样式11

2.3调用Bootstrap组件14

2.4调用BootstrapJS特效16

2.5实战：一个Bootstrap实现的响应式页面17

2.6本章小结19

第3章Bootstrap脚手架20

3.1Bootstrap全局样式20

3.1.1什么是全局样式20

3.1.2基于HTML5文档类型20

3.1.3屏幕、排版与链接21

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特点31

3.4.3Bootstrap支持的设备31

3.4.4响应式布局辅助类32

3.4.5如何应用响应式布局32

3.5本章小结32

第4章Bootstrap样式设计33

4.1Bootstrap排版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.2Bootstrap表格49

4.2.1默认样式表格49

4.2.2斑马纹样式表格51

4.2.3圆角边框样式表格52

4.2.4鼠标悬停样式表格53

4.2.5带行属性样式表格55

4.3Bootstrap按钮56

4.3.1默认样式按钮56

4.3.2按钮大小样式58

4.3.3特殊样式按钮59

4.4Bootstrap图片61

4.5本章小结61

第5章Bootstrap组件设计62

5.1Bootstrap下拉菜单62

5.1.1标签62

5.1.2对齐方式63

5.1.3禁用64

5.1.4子下拉菜单65

5.2Bootstrap按钮组69

5.2.1基本按钮组69

5.2.2工具栏按钮组69

5.2.3垂直按钮组71

5.3Bootstrap按钮式下拉菜单71

5.4Bootstrap导航75

5.4.1默认标签导航75

5.4.2pills标签导航76

5.4.3堆叠式标签导航76

5.4.4下拉菜单式标签导航77

5.4.5导航列表78

5.4.6标签页式导航80^[2]

5.5Bootstrap导航条81

5.5.1默认样式导航条81

5.5.2导航条表单82

5.5.3响应式导航条84

5.6Bootstrap分页86

5.6.1标准分页方式86

5.6.2翻页分页方式87

5.7Bootstrap标签与徽章88

5.8Bootstrap进度条89

5.8.1基本样式进度条89

5.8.2斜条纹样式进度条90

5.8.3堆叠样式进度条91

5.9Glyphicons字体图标92

5.10本章小结93

第6章Bootstrap插件设计94

6.1Bootstrap插件概述94

6.1.1单个或全部引入94

6.1.2data属性95

6.1.3事件95

6.2Bootstrap模态对话框95

6.2.1模态对话框说明96

6.2.2静态模态对话框96

6.2.3动态模态对话框97

6.3Bootstrap下拉菜单（高级版）100

6.4Bootstrap滚动监听103

6.5Bootstrap可切换式标签页106

6.6Bootstrap提示框109

6.6.1工具提示框109

6.6.2弹出框112

6.6.3警告框116

6.7Bootstrap按钮117

6.7.1状态按钮118

6.7.2复选按钮119

6.7.3单选按钮120

6.8Bootstrap折叠122

6.9Bootstrap幻灯125

6.10本章小结126

第7章Bootstrap响应式多媒体127

7.1Bootstrap图标的响应式127

7.2Bootstrap图像的响应式129

7.2.1可适配的图像129

7.2.2图像网格131

7.3Bootstrap视频的响应式137

7.4本章小结137

第8章Bootstrap扁平化风格页面138

8.1扁平化设计概述138

8.1.1介绍138

8.1.2设计理念139

8.1.3页面架构139

8.2页眉设计141

8.2.1导航条141

8.2.2导航条图标141

8.2.3导航条功能菜单143

8.2.4页眉标题147

8.3左侧导航设计148

8.4页面主体设计151

8.4.1图片列表151

8.4.2提交表单153

8.4.3文本列表156

8.5页脚设计158

8.6本章小结159

第9章Bootstrap图片幻灯页面160

9.1图片幻灯风格页面设计概述160

9.2页眉设计161

9.3页面主体设计163

9.3.1图片幻灯163^[2]

9.3.2图标列表166

9.3.3图片特辑167

9.4本章小结168

第10章Bootstrap风格按钮169

10.1风格按钮设计概述169

10.2形状与尺寸风格按钮170

10.3边框风格按钮172

10.4下拉菜单风格按钮174

10.5按钮组风格176

10.6本章小结177

第11章Bootstrap响应式表格设计178

11.1表格设计概述178

11.2Bootstrap基本表格180

11.3Bootstrap数组表格182

11.4BootstrapAjax表格183

11.5本章小结185

第12章Bootstrap响应式图表设计186

12.1图表设计概述186

12.2柱状图图表188

12.3折线图图表190

12.4饼状图图表195

12.5本章小结198

第13章jQueryUIBootstrap工具199

13.1jQueryUIBootstrap工具概述199

13.1.1jQueryUI工具199

13.1.2jQueryUIBootstrap工具200

13.1.3jQueryUIBootstrap应用200

13.2按钮（Button）201

13.2.1基本样式按钮202

13.2.2Set样式按钮203

13.2.3工具条样式按钮205

13.3折叠面板（Accordion）206

13.4对话框（Dialog）209

13.4.1非模态对话框209

13.4.2模态对话框211

13.5标签页（Tabs）214

13.5.1基本样式标签页214

13.5.2可编辑样式标签页217

13.6Overlay与Shadow223

13.7Highlight与Error224

13.8日期选择器（Datepicker）226

13.9滑块（Slider）227

13.9.1水平滑块（HorizontalSlider）227

13.9.2垂直滑块（VerticalSlider）228

13.10自动完成（Autocomplete）230

13.11下拉菜单（Menu）232

13.12提示信息（Tooltip）234

13.13微调按钮（Spinner）236

13.14本章小结239

第14章jQueryMobile框架与Bootstrap主题风格240

14.1jQueryMobile Bootstrap概述240

14.1.1jQueryMobile框架240

14.1.2Bootstrap主题风格241

14.1.3应用开发基础241

14.2主页设计243

14.3按钮设计245

14.4列表设计248

14.5导航设计251

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

第15章实战：应用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选择器速览291^[2]