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

第1 章 認識Bootstrap
1.1 為什么要學(xué)習(xí)Bootstrap
1.2 Bootstrap 為何如此流行
1.2.1 功能強大和樣式美觀的強強聯(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 在自己的項目中引入Bootstrap ?
2.1.2 添加Bootstrap 的class 實現(xiàn)基本樣式
2.2 Bootstrap 的通用組件調(diào)用
2.3 添加JavaScript 動態(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ā)實戰(zhàn)

第4 章 Bootstrap 的基本樣式
4.1 字體版式
4.1.1 標題
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 分頁
5.8 標簽與徽章
5.9 縮略圖
5.10 面板
5.11 進度條
5.12 多媒體對象
本章總結(jié)
本章作業(yè)
第6 章 LESS 和SASS
6.1 為什么要用CSS 預(yù)處理程序
6.1.1 CSS 不能設(shè)置變量
6.1.2 冗余重復(fù)的代碼
6.1.3 無法實現(xiàn)計算功能
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ù)和運算
6.2.7 LESS 語言總結(jié)
6.3 SASS 的應(yīng)用
6.3.1 SASS 介紹
6.3.2 SASS 安裝和使用
6.3.3 使用變量
6.3.4 計算
6.3.5 嵌套
6.3.6 代碼重用
6.3.7 高級用法
6.3.8 SASS 總結(jié)
6.4 使用SASS 的擴展庫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)對話框
7.3.1 用法
7.3.2 對話框結(jié)構(gòu)
7.4 標簽頁切換
7.4.1 標簽頁用法
7.4.2 用jQuery 實現(xiàn)標簽頁切換
7.5 工具提示條
7.5.1 用法
7.5.2 用js 使標簽頁生效
7.6 彈出框
7.6.1 用法
7.6.2 用js 使彈出框生效
7.7 提示信息
7.7.1 用法
7.7.2 選項
7.8 按鈕
7.8.1 按鈕的Loading 狀態(tài)
?VIII?
Bootstrap 響應(yīng)式網(wǎng)站開發(fā)實戰(zhàn)

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


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

11.4 設(shè)計產(chǎn)品詳情頁product.html
本章總結(jié)
本章作業(yè)
第12 章 Bootstrap 內(nèi)核解碼
12.1 Bootstrap 設(shè)計思想
12.1.1 12 列柵格系統(tǒng)
12.1.2 樣式類型化
12.1.3 代碼松散與耦合的處理
12.1.4 繼承可擴展性
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è)