《响应式网页设计-Bootstrap开发速成》

基本简介[url=]编辑[/url][url=] 播报[/url]
本书从认识响应式网页设计与Bootstrap开始，详解网站的开发流程、响应式网页的设计思维、SEO设置以及网页设计趋势，导入视觉设计与网页制作两个不同领域的专业知识，并提供120多个Bootstrap功能范例网页文件，说明如何使用Bootstrap框架所提供的各种CSS与组件等内容，最终以3个完整实例（书籍宣传网页、产品推广网页、网站首页）制作出响应式网页，以让大家综合运用所学知识，提高实战技能。本书以丰富的范例程序和详细的图解逐一讲解 RWD 技术 + Bootstrap 结合使用的核心技术和方法，既适合负责网页前端和后端的程序人员阅读，也适合网站的企划人员和视觉设计人员参考，还可供想学习和了解响应式网页设计 + Bootstrap 开发网站的人员自学和参考。 [1]

图书目录[url=]编辑[/url][url=] 播报[/url]
第1章 响应式网页简介 1
1.1 何谓响应式网页 1
1.2 响应式网页的优点 2
1.3 响应式网页的缺点 3
1.4 响应式的概念 3
1.5 Viewport 4
1.6 流式网格 5
1.6.1 网格设计 5
1.6.2 流式布局 6
1.7 媒体查询的基础 7
1.7.1 使用方法 8
1.7.2 设置方式 8
1.7.3 媒体类型 8
1.7.4 判断条件 9
1.7.5 媒体特征 10
1.8 流式图像 10
1.9 字体 11
第2章 Bootstrap简介 12
2.1 何谓Bootstrap 12
2.2 Bootstrap 具有哪些内容 12
2.3 下载Bootstrap 13
2.4 链接Bootstrap框架 15
2.5 下载与链接 jQuery 文件 16
2.6 快速体验——运用 CSS 样式 17
第3章 网站的开发流程 20
3.1 项目 20
3.2 企划 21
3.3 设计 21
3.4 前端 22
3.5 后端 22
3.6 测试 23
3.7 上线 23
第4章 响应式网页的设计思维 25
4.1 与传统网站开发的差异 25
4.2 响应式网页的设计考虑 26
4.3 移动设备的设计考虑 28
4.3.1 移动设备的特征 28
4.3.2 移动设备优先 28
第5章 视觉设计师与前端工程师的专业认知 31
5.1 网页与印刷的差异 31
5.2 网页向量格...
5.3版面设计时的常见词汇33
5.4网格的运用与制作35
5.4.1网格辅助——PSD35
5.4.2网格辅助——AI36
5.4.3网格辅助——自行设置38
5.5让视觉设计师懂得切版42
5.5.1切版重点42
5.5.2了解版面的构成42
第6章SEO简介44
6.1何谓SEO44
6.2改善网站标题与描述45
6.3改善网站架构47
6.3.1网站架构简介47
6.3.2架构最佳做法48
6.3.3让网站更易于浏览48
6.3.4易于浏览的最佳做法49
6.4可优化的内容与做法50
6.4.1优质内容与服务50
6.4.2链接50
6.4.3图片51
6.4.4标题52
6.5管理与营销53
6.5.1使用网站管理工具53
6.5.2网站营销工作要点54
第7章网页设计趋势56
7.1响应式网页设计56
7.2全幅背景57
7.3单页式网页57
7.4固定式菜单59
7.5扁平化设计59
7.6微动画60
7.7卡片式设计61
7.8隐藏式菜单61
7.9超大的字体62
7.10幽灵按钮63
第8章HTML5+CSS3的基础知识64
8.1认识DIV与CSS64
8.1.1认识DIV64
8.1.2CSSClass与CSSID65
8.2HTML5与CSS3的新增内容67
8.2.1认识HTML567
8.2.2HTML5的新元素与属性68
8.2.3认识CSS371
8.2.4CSS3新增的属性71
第9章响应式网页的布局方式76
9.1GridSystem简介76
9.1.1何谓GridSystem76
9.1.2网页的GridSystem77
9.1.3网页设计为何需要GridSystem78
9.1.4GridSystem的使用方法78
9.2布局规则79
9.2.1Bootstrap中的GridSystem79
9.2.2不同设备的Grid设置80
9.2.3嵌套排版82
9.2.4移动与调整Column的位置83
9.2.5Column的规则83
9.2.6调整Column的顺序84
第10章BootstrapCSS样式的使用86
10.1排版86
10.1.1标题86
10.1.2页面主题87
10.1.3行内文字元素88
10.1.4对齐类90
10.1.5转换类91
10.1.6联系字段91
10.1.7引用91
10.1.8列表93
10.2表格95
10.2.1表格类95
10.2.2状态类97
10.2.3响应式表格97
10.3窗体98
10.3.1基本范例98
10.3.2窗体布局99
10.3.3支持的控件100
10.3.4焦点状态105
10.3.5禁用状态105
10.3.6只读状态106
10.3.7验证状态106
10.4按钮108
10.4.1按钮标签108
10.4.2颜色类109
10.4.3大小类109
10.4.4启用状态111
10.4.5禁用状态111
10.5图片113
10.5.1响应式图片113
10.5.2图片形状113
第11章Bootstrap布局组件的使用115
11.1字体图标115
11.2下拉式菜单116
11.2.1说明116
11.2.2使用的方法116
11.2.3其他辅助项目117
11.2.4范例119
11.3按钮群组120
11.3.1说明120
11.3.2使用方法120
11.3.3其他辅助项目120
11.3.4范例122
11.4输入框群组123
11.4.1说明123
11.4.2使用方法123
11.4.3其他辅助项目124
11.4.4范例125
11.5导航127
11.5.1说明127
11.5.2使用方法127
11.5.3其他辅助项目127
11.5.4范例129
11.6导航栏130
11.6.1说明130
11.6.2使用方法130
11.6.3其他辅助项目131
11.6.4范例133
11.7分页135
11.7.1说明135
11.7.2使用方法135
11.7.3其他辅助项目135
11.7.4范例137
11.8提示标志137
11.8.1说明137
11.8.2范例138
11.9大屏幕效果138
11.9.1说明138
11.9.2范例139
11.10缩略图139
11.10.1说明139
11.10.2使用方法140
11.10.3范例140
11.11进度条141
11.11.1说明141
11.11.2使用方法142
11.11.3其他辅助项目142
11.11.4范例144
11.12面板144
11.12.1说明144
11.12.2使用方法144
11.12.3其他辅助项目145
11.12.4范例146
11.13响应式嵌入内容147
11.13.1说明147
11.13.2范例147
第12章BootstrapJS插件的使用149
12.1概观149
12.2页签149
12.2.1说明149
12.2.2使用方法150
12.2.3淡入效果150
12.2.4范例150
12.3提示工具152
12.3.1说明152
12.3.2使用方法152
12.3.3范例153
12.4弹出提示154
12.4.1说明154
12.4.2使用方法154
12.4.3范例155
12.5折叠效果156
12.5.1说明156
12.5.2使用方法156
12.5.3范例157
12.6轮播效果159
12.6.1说明159
12.6.2使用方法159
12.6.3标题制作161
12.6.4范例161
第13章网站实践——书籍宣传网页164
13.1套入链接164
13.2网格布局165
13.3页面设计166
13.3.1左边容器166
13.3.2右边容器167
13.4CSS美化与运用171
第14章网站实践——产品推广网页174
14.1套入链接174
14.2网格布局175
14.2.1建立分层说明文字175
14.2.2最外层与第一层的布局176
14.2.3第二层的布局177
14.2.4第三层左边的布局178
14.2.5第三层右边的布局179
14.2.6第四层的布局180
14.3页面设计180
14.3.1第一层设计180
14.3.2第二层设计180
14.3.3第三层左边的设计181
14.3.4第三层右边的设计183
14.3.5第四层设计183
14.4运用CSS184
14.4.1第一层184
14.4.2第二层185
14.4.3第三层左边186
14.4.4第三层右边187
14.4.5第四层189
第15章网站实践——网站首页制作190
15.1套入链接190
15.2网格布局191
15.2.1建立层次说明文字192
15.2.2第一层与第二层布局193
15.2.3第三层布局193
15.2.4第四层布局194
15.2.5第五层与第六层布局195
15.3第一层设计——菜单195
15.3.1运用导航栏JavaScript195
15.3.2修改类196
15.3.3运用CSS样式197
15.4第二层设计——广告横幅198
15.4.1使用轮播JavaScript198
15.4.2修改内容199
15.4.3运用CSS样式200
15.5第三层设计——最新公告与广告区200
15.5.1加入最新公告图片200
15.5.2应用折叠效果JavaScript201
15.5.3修改类201
15.5.4加入广告图片202
15.5.5运用CSS样式203
15.6第四层设计——课程分享204
15.6.1加入课程标题图片204
15.6.2加入课程1图片与内容204
15.6.3加入课程2图片与内容205
15.6.4加入课程3图片与内容206
15.6.5加入课程4图片与内容206
15.6.6运用CSS样式207
15.7第五层设计——按钮链接210
15.7.1加入图片210
15.7.2运用CSS样式211
15.8第六层页面设计——页脚212
15.8.1加入文字212
15.8.2运用CSS样式212
15.9回到顶部按钮的制作212
15.10检查各尺寸浏览状态214
15.10.1问题一的解决方式214
15.10.2问题二的解决方式215
第16章辅助工具217
16.1Bootstrap套件下载217
16.2可视化Bootstrap在线编辑器219
16.2.1GRIDSYSTEM219
16.2.2BASICCSS220
16.2.3COMPONENTS221
16.2.4JAVASCRIPT222
16.2.5预览版式222
16.2.6下载结果223
16.3浏览器开发者模式检测224
16.3.1Firefox浏览器224
16.3.2IE浏览器226
16.3.3GoogleChrome浏览器226
16.3.4在线检测228
16.3.5插件的辅助检测231
16.4尺寸对照工具232
16.5检测优化工具233
16.6设备尺寸参考234