Bootstrap響應(yīng)式網(wǎng)站開發(fā)實(shí)戰(zhàn)

第1 章 認(rèn)識(shí)Bootstrap
1.1 為什么要學(xué)習(xí)Bootstrap
1.2 Bootstrap 為何如此流行
1.2.1 功能強(qiáng)大和樣式美觀的強(qiáng)強(qiáng)聯(lián)合
1.2.2 高度可定制性
1.2.3 豐富的生態(tài)圈
1.2.4 布局兼容性良好
1.3 Bootstrap 的版本發(fā)展
1.3.1 Bootstrap 1
1.3.2 Bootstrap 2
1.3.3 Bootstrap 3
1.3.4 Bootstrap 4
本章總結(jié)
本章作業(yè)
第2 章 Bootstrap 框架基礎(chǔ)
2.1 引入Bootstrap
2.1.1 在自己的項(xiàng)目中引入Bootstrap ?
2.1.2 添加Bootstrap 的class 實(shí)現(xiàn)基本樣式
2.2 Bootstrap 的通用組件調(diào)用
2.3 添加JavaScript 動(dòng)態(tài)效果
本章總結(jié)
本章作業(yè)
第3 章 Bootstrap 柵格系統(tǒng)
3.1 固定布局的概念
3.2 固定布局的柵格系統(tǒng)
3.3 流式布局的柵格系統(tǒng)
3.4 響應(yīng)式布局的柵格系統(tǒng)
本章總結(jié)
本章作業(yè)

Bootstrap 響應(yīng)式網(wǎng)站開發(fā)實(shí)戰(zhàn)

第4 章 Bootstrap 的基本樣式
4.1 字體版式
4.1.1 標(biāo)題
4.1.2 全局設(shè)置
4.2 表格
4.3 按鈕
4.4 表單
4.5 圖片
本章總結(jié)
本章作業(yè)
第5 章 使用Bootstrap 的組件
5.1 下拉菜單
5.2 按鈕組
5.3 input 控件組
5.4 導(dǎo)航
5.5 頭部導(dǎo)航
5.6 列表組
5.7 分頁(yè)
5.8 標(biāo)簽與徽章
5.9 縮略圖
5.10 面板
5.11 進(jìn)度條
5.12 多媒體對(duì)象
本章總結(jié)
本章作業(yè)
第6 章 LESS 和SASS
6.1 為什么要用CSS 預(yù)處理程序
6.1.1 CSS 不能設(shè)置變量
6.1.2 冗余重復(fù)的代碼
6.1.3 無法實(shí)現(xiàn)計(jì)算功能
6.1.4 命名空間與作用域
6.1.5 CSS 缺陷總結(jié)
6.2 LESS 的應(yīng)用
6.2.1 LESS 介紹
6.2.2 LESS 使用基礎(chǔ)
6.2.3 使用變量
6.2.4 使用混合
6.2.5 嵌套規(guī)則
?VII?


6.2.6 函數(shù)和運(yùn)算
6.2.7 LESS 語(yǔ)言總結(jié)
6.3 SASS 的應(yīng)用
6.3.1 SASS 介紹
6.3.2 SASS 安裝和使用
6.3.3 使用變量
6.3.4 計(jì)算
6.3.5 嵌套
6.3.6 代碼重用
6.3.7 高級(jí)用法
6.3.8 SASS 總結(jié)
6.4 使用SASS 的擴(kuò)展庫(kù)Compass
6.4.1 Reset 模塊
6.4.2 CSS3 模塊
6.4.3 Utilities 模塊
6.4.4 Helpers 函數(shù)
6.4.5 Compass 總結(jié)
本章總結(jié)
第7 章 使用Bootstrap 插件
7.1 概述
7.2 過渡插件
7.3 模態(tài)對(duì)話框
7.3.1 用法
7.3.2 對(duì)話框結(jié)構(gòu)
7.4 標(biāo)簽頁(yè)切換
7.4.1 標(biāo)簽頁(yè)用法
7.4.2 用jQuery 實(shí)現(xiàn)標(biāo)簽頁(yè)切換
7.5 工具提示條
7.5.1 用法
7.5.2 用js 使標(biāo)簽頁(yè)生效
7.6 彈出框
7.6.1 用法
7.6.2 用js 使彈出框生效
7.7 提示信息
7.7.1 用法
7.7.2 選項(xiàng)
7.8 按鈕
7.8.1 按鈕的Loading 狀態(tài)
?VIII?
Bootstrap 響應(yīng)式網(wǎng)站開發(fā)實(shí)戰(zhàn)

7.8.2 按鈕組的狀態(tài)設(shè)置
7.9 折疊
7.9.1 用法
7.9.2 選項(xiàng)
7.10 幻燈片
7.10.1 用法
7.10.2 選項(xiàng)
本章總結(jié)
本章作業(yè)
第8 章 定制及優(yōu)化Bootstrap
8.1 在官方網(wǎng)站進(jìn)行Bootstrap 定制
8.2 修改源代碼定制Bootstrap
8.3 其他Bootstrap 資源
本章總結(jié)
本章作業(yè)
第9 章 開發(fā)響應(yīng)式企業(yè)網(wǎng)站
9.1 布局企業(yè)站首頁(yè)
9.1.1 準(zhǔn)備SASS
9.1.2 構(gòu)建頁(yè)面框架
9.2 設(shè)計(jì)首頁(yè)
9.2.1 設(shè)計(jì)index 頁(yè)面導(dǎo)航
9.2.2 設(shè)計(jì)安全展示區(qū)
9.2.3 添加搜索欄
9.2.4 主體內(nèi)容區(qū)塊
9.2.5 添加另一主體內(nèi)容區(qū)塊
9.2.6 添加一個(gè)兩欄圖文區(qū)塊
9.2.7 添加另一個(gè)兩欄圖文區(qū)塊
9.2.8 添加footer 區(qū)塊
9.2.9 添加頁(yè)面樣式
9.3 設(shè)計(jì)about.html 頁(yè)面
9.3.1 保留頁(yè)面通用部分，添加about.html 頁(yè)面區(qū)塊
9.3.2 添加頁(yè)面主體區(qū)塊
9.3.3 添加團(tuán)隊(duì)展示區(qū)塊
9.3.4 添加另一標(biāo)題區(qū)塊
9.3.5 為about.html 頁(yè)面添加樣式 ????
9.4 設(shè)計(jì)services.html 頁(yè)面
9.4.1 保留頁(yè)面通用部分，修改主體頁(yè)面區(qū)塊
9.4.2 添加what we do 區(qū)塊
?IX?


9.4.3 添加scss 樣式
9.5 設(shè)計(jì)blog.html 頁(yè)面
9.5.1 保留頁(yè)面通用部分，修改主體頁(yè)面區(qū)塊
9.5.2 添加blog.html 樣式
9.6 設(shè)計(jì)contact.html 頁(yè)面
9.6.1 保留頁(yè)面通用部分，添加公司地址
9.6.2 添加用戶表單
9.7 用媒體查詢進(jìn)行移動(dòng)端優(yōu)化設(shè)計(jì)
本章總結(jié)
本章作業(yè)
第10 章 網(wǎng)站后臺(tái)管理系統(tǒng)
10.1 項(xiàng)目開始
10.2 頁(yè)面布局
10.2.1 引入Bootstrap 3 框架
10.2.2 編寫布局代碼
10.3 實(shí)現(xiàn)導(dǎo)航欄
10.3.1 構(gòu)建導(dǎo)航的框架代碼
10.3.2 填寫標(biāo)題和導(dǎo)航鏈接
10.3.3 添加管理員和退出系統(tǒng)按鈕 ?
10.3.4 添加管理員登錄信息
10.3.5 為導(dǎo)航添加圖標(biāo)并設(shè)置響應(yīng)式導(dǎo)航
10.4 實(shí)現(xiàn)左側(cè)邊欄
10.5 實(shí)現(xiàn)主功能部分
10.5.1 主功能的頭部
10.5.2 內(nèi)容管理的文章列表
本章總結(jié)
本章作業(yè)
第11 章 使用Bootstrap 實(shí)現(xiàn)電商網(wǎng)站
11.1 設(shè)計(jì)電商首頁(yè)index.html
11.1.1 搭建Bootstrap 框架
11.1.2 為商城創(chuàng)建導(dǎo)航菜單
11.1.3 向?qū)Ш教砑雍蛯?dǎo)航鏈接 ??
11.1.4 為頁(yè)面添加Banner
11.1.5 添加產(chǎn)品
11.1.6 為網(wǎng)站添加底部Footer
11.1.7 添加產(chǎn)品列表及產(chǎn)品介紹
11.2 設(shè)計(jì)購(gòu)買頁(yè)面buy.html
11.3 設(shè)計(jì)列表頁(yè)category.html
?X?
Bootstrap 響應(yīng)式網(wǎng)站開發(fā)實(shí)戰(zhàn)

11.4 設(shè)計(jì)產(chǎn)品詳情頁(yè)product.html
本章總結(jié)
本章作業(yè)
第12 章 Bootstrap 內(nèi)核解碼
12.1 Bootstrap 設(shè)計(jì)思想
12.1.1 12 列柵格系統(tǒng)
12.1.2 樣式類型化
12.1.3 代碼松散與耦合的處理
12.1.4 繼承可擴(kuò)展性
12.2 Bootstrap 框架解析
12.2.1 源碼結(jié)構(gòu)
12.2.2 類定義
12.2.3 插件定義
12.2.4 命名沖突的解決
12.2.5 數(shù)據(jù)接口
12.3 定義jQuery 插件
12.3.1 jQuery 插件形式
12.3.2 jQuery 插件規(guī)范
12.3.3 jQuery 插件封裝
本章總結(jié)
本章作業(yè)