定 價:¥89.80
作 者: | 前端科技 著 |
出版社: | 清華大學(xué)出版社 |
叢編項: | 清華社"視頻大講堂"大系 |
標(biāo) 簽: | 暫缺 |
ISBN: | 9787302522492 | 出版時間: | 2019-04-01 | 包裝: | 平裝 |
開本: | 16 | 頁數(shù): | 488 | 字?jǐn)?shù): |
第1章 CSS3基礎(chǔ)
視頻講解:36分鐘
1.1 CSS概述
1.1.1 CSS歷史
1.1.2 CSS3模塊
1.1.3 CSS3開發(fā)狀態(tài)
1.1.4 瀏覽器支持狀態(tài)
1.2 CSS基本用法
1.2.1 CSS樣式
1.2.2 引入CSS樣式
1.2.3 CSS樣式表
1.2.4 導(dǎo)入外部樣式表
1.2.5 CSS格式化
1.2.6 CSS屬性
1.2.7 CSS屬性值
1.3 CSS特性
1.3.1 CSS繼承性
1.3.2 CSS層疊性
1.4 案例實戰(zhàn)
1.5 在線練習(xí)
第2章 CSS3選擇器
視頻講解:50分鐘
2.1 CSS3選擇器概述
2.2 元素選擇器
2.2.1 標(biāo)簽選擇器
2.2.2 類選擇器
2.2.3 ID選擇器
2.2.4 通配選擇器
2.3 關(guān)系選擇器
2.3.1 包含選擇器
2.3.2 子選擇器
2.3.3 相鄰選擇器
2.3.4 兄弟選擇器
2.3.5 分組選擇器
2.4 屬性選擇器
2.5 偽類選擇器
2.5.1 偽選擇器概述
2.5.2 結(jié)構(gòu)偽類
2.5.3 否定偽類
2.5.4 狀態(tài)偽類
2.5.5 目標(biāo)偽類
2.5.6 動態(tài)偽類
2.6 偽對象選擇器
2.7 案例實戰(zhàn)
2.7.1 設(shè)計表格樣式
2.7.2 設(shè)計超鏈接樣式
2.8 在線練習(xí)
第3章 使用CSS3美化文本和圖像
視頻講解:1小時19分鐘
3.1 設(shè)計字體樣式
3.1.1 定義字體類型
3.1.2 定義字體大小
3.1.3 定義字體顏色
3.1.4 定義字體粗細(xì)
3.1.5 定義藝術(shù)字體
3.1.6 定義修飾線
3.1.7 定義字體的變體
3.1.8 定義大小寫字體
3.2 設(shè)計文本樣式
3.2.1 定義文本對齊
3.2.2 定義垂直對齊
3.2.3 定義文本間距
3.2.4 定義行高
3.2.5 定義首行縮進
3.3 設(shè)計圖像樣式
3.3.1 定義圖像大小
3.3.2 定義圖像邊框
3.3.3 定義不透明度
3.3.4 定義圓角特效
3.3.5 定義陰影特效
3.4 案例實戰(zhàn)
3.4.1 設(shè)計正文版式1
3.4.2 設(shè)計正文版式2
3.5 在線練習(xí)
第4章 使用CSS3設(shè)計特效文本
視頻講解:1小時14分鐘
4.1 CSS3文本模塊
4.1.1 文本模塊概述
4.1.2 文本溢出
4.1.3 文本換行
4.1.4 書寫模式
4.1.5 initial值
4.1.6 inherit值
4.1.7 unset值
4.1.8 all屬性
4.2 色彩模式
4.2.1 rgba()函數(shù)
4.2.2 hsl()函數(shù)
4.2.3 hsla()函數(shù)
4.2.4 opacity屬性
4.2.5 transparent值
4.2.6 currentColor值
4.3 文本陰影
4.3.1 定義text-shadow
4.3.2 案例:設(shè)計特效字
4.4 內(nèi)容生成和替換
4.4.1 定義content
4.4.2 案例:應(yīng)用content
4.5 網(wǎng)絡(luò)字體
4.5.1 使用@font-face
4.5.2 案例:設(shè)計字體圖標(biāo)
4.6 案例實戰(zhàn)
4.6.1 設(shè)計黑科技網(wǎng)站首頁
4.6.2 設(shè)計消息提示框
4.7 在線練習(xí)
第5章 使用CSS設(shè)計背景樣式
視頻講解:1小時3分鐘
5.1 設(shè)計背景圖像
5.1.1 設(shè)置背景圖像
5.1.2 設(shè)置顯示方式
5.1.3 設(shè)置顯示位置
5.1.4 設(shè)置固定背景
5.1.5 設(shè)置定位原點
5.1.6 設(shè)置裁剪區(qū)域
5.1.7 設(shè)置背景圖像大小
5.1.8 設(shè)置多重背景圖像
5.2 設(shè)計漸變背景
5.2.1 定義線性漸變
5.2.2 設(shè)計線性漸變樣式
5.2.3 案例:設(shè)計網(wǎng)頁漸變色
5.2.4 案例:設(shè)計條紋背景
5.2.5 定義重復(fù)線性漸變
5.2.6 定義徑向漸變
5.2.7 設(shè)計徑向漸變樣式
5.2.8 定義重復(fù)徑向漸變
5.2.9 案例:設(shè)計網(wǎng)頁背景色
5.2.10 案例:設(shè)計按鈕
5.2.11 案例:設(shè)計圖標(biāo)
5.3 案例實戰(zhàn)
5.3.1 設(shè)計優(yōu)惠券
5.3.2 設(shè)計桌面紋理背景
5.3.3 漸變特殊應(yīng)用場景
5.3.4 設(shè)計欄目折角效果
5.4 在線練習(xí)
第6章 使用CSS3美化列表和超鏈接樣式
視頻講解:38分鐘
6.1 設(shè)計超鏈接樣式
6.1.1 使用動態(tài)偽類
6.1.2 定義下畫線樣式
6.1.3 定義特效樣式
6.1.4 定義光標(biāo)樣式
6.2 設(shè)計列表樣式
6.2.1 定義項目符號類型
6.2.2 定義項目符號圖像
6.2.3 模擬項目符號
6.3 案例實戰(zhàn)
6.3.1 設(shè)計圖形按鈕鏈接
6.3.2 設(shè)計背景滑動樣式
6.3.3 設(shè)計背景交換樣式
6.3.4 設(shè)計水平滑動菜單
6.3.5 設(shè)計垂直滑動菜單
6.3.6 設(shè)計Tab選項面板
6.3.7 設(shè)計下拉式面板
6.4 在線練習(xí)
第7章 使用CSS美化表格
視頻講解:55分鐘
7.1 表格屬性
7.1.1 設(shè)置表格屬性
7.1.2 設(shè)置單元格屬性
7.2 表格基本樣式
7.2.1 設(shè)計表格邊框線
7.2.2 定義單元格間距和空隙
7.2.3 隱藏空單元格
7.2.4 定義標(biāo)題樣式
7.3 案例實戰(zhàn)
7.3.1 設(shè)計斑馬線表格
7.3.2 設(shè)計粗線框表格
7.3.3 設(shè)計淺色風(fēng)格表格
7.3.4 設(shè)計清新風(fēng)格表格
7.3.5 設(shè)計圓潤邊框表格
7.3.6 設(shè)計數(shù)據(jù)分組表格
7.3.7 設(shè)計單線表格
7.3.8 設(shè)計日歷表
7.4 在線練習(xí)
第8章 使用CSS美化表單
視頻講解:46分鐘
8.1 HTML5表單基礎(chǔ)
8.2 案例實戰(zhàn)
8.2.1 設(shè)計登錄表單
8.2.2 設(shè)計信息登記表
8.2.3 設(shè)計易用表單
8.2.4 設(shè)計注冊表單
8.2.5 設(shè)計聯(lián)系表單
8.2.6 設(shè)計高亮樣式
8.2.7 設(shè)計圖標(biāo)表單
8.2.8 設(shè)計反饋表
8.2.9 設(shè)計搜索表單
8.3 在線練習(xí)
第9章 CSS盒模型
視頻講解:39分鐘
9.1 盒模型基礎(chǔ)
9.1.1 盒模型概述
9.1.2 盒模型結(jié)構(gòu)
9.1.3 定義盒模型大小
9.2 邊框
9.2.1 定義寬度
9.2.2 定義顏色
9.2.3 定義樣式
9.2.4 案例:設(shè)計行內(nèi)元素邊框
9.3 邊界
9.3.1 定義邊界
9.3.2 案例:邊界的應(yīng)用
9.3.3 案例:邊界重疊現(xiàn)象
9.3.4 行內(nèi)元素邊界
9.4 補白
9.5 在線練習(xí)
第10章 使用CSS布局網(wǎng)頁
視頻講解:1小時9分鐘
10.1 顯示類型
10.2 CSS布局類型
10.3 流動布局
10.3.1 流動元素
10.3.2 相對定位元素
10.4 浮動布局
10.4.1 定義浮動顯示
10.4.2 清除浮動
10.4.3 浮動嵌套
10.4.4 案例:混合浮動布局
10.5 定位布局
10.5.1 定義定位顯示
10.5.2 相對定位
10.5.3 定位框
10.5.4 層疊順序
10.5.5 案例:混合定位布局
10.6 案例實戰(zhàn)
10.6.1 設(shè)計固定+彈性頁面
10.6.2 設(shè)計兩欄彈性頁面
10.6.3 設(shè)計兩欄浮動頁面
10.6.4 設(shè)計三欄彈性頁面
10.6.5 設(shè)計兩列固定+單列彈性頁面
10.6.6 設(shè)計兩列彈性+單列固定頁面
10.7 在線練習(xí)
第11章 CSS3伸縮盒布局
視頻講解:32分鐘
11.1 多列布局
11.1.1 設(shè)置列寬
11.1.2 設(shè)置列數(shù)
11.1.3 設(shè)置間距
11.1.4 設(shè)置列邊框
11.1.5 設(shè)置跨列顯示
11.1.6 設(shè)置列高度
11.2 舊版伸縮盒
11.2.1 啟動伸縮盒
11.2.2 設(shè)置寬度
11.2.3 設(shè)置順序
11.2.4 設(shè)置方向
11.2.5 設(shè)置對齊方式
11.3 新版伸縮盒
11.3.1 認(rèn)識Flexbox系統(tǒng)
11.3.2 啟動伸縮盒
11.3.3 設(shè)置主軸方向
11.3.4 設(shè)置行數(shù)
11.3.5 設(shè)置對齊方式
11.3.6 設(shè)置伸縮項目
11.4 瀏覽器支持
11.4.1 瀏覽器對Flexbox的支持
11.4.2 比較Flexbox新舊版本
11.5 案例實戰(zhàn)
11.5.1 設(shè)計3欄頁面
11.5.2 設(shè)計3行3列應(yīng)用
11.6 在線練習(xí)
第12章 設(shè)計CSS3用戶界面樣式
視頻講解:36分鐘
12.1 界面顯示
12.1.1 顯示方式
12.1.2 調(diào)整尺寸
12.1.3 縮放比例
12.2 輪廓樣式
12.2.1 定義輪廓
12.2.2 設(shè)計輪廓線
12.3 邊框樣式
12.3.1 定義邊框圖像源
12.3.2 定義邊框圖像平鋪方式
12.3.3 定義邊框圖像寬度
12.3.4 定義邊框圖像分割方式
12.3.5 定義邊框圖像擴展
12.3.6 案例:應(yīng)用邊框圖像
12.3.7 定義圓角邊框
12.3.8 案例:設(shè)計橢圓圖形
12.4 盒子陰影
12.4.1 定義盒子陰影
12.4.2 案例:box-shadow的應(yīng)用
12.4.3 案例:設(shè)計翹邊陰影
12.5 案例實戰(zhàn)
12.5.1 設(shè)計內(nèi)容頁
12.5.2 設(shè)計應(yīng)用界面
12.6 在線練習(xí)
第13章 設(shè)計CSS3動畫
視頻講解:1小時4分鐘
13.1 CSS3變形
13.1.1 認(rèn)識Transform
13.1.2 設(shè)置原點
13.1.3 2D旋轉(zhuǎn)
13.1.4 2D縮放
13.1.5 2D平移
13.1.6 2D傾斜
13.1.7 2D矩陣
13.1.8 設(shè)置變形類型
13.1.9 設(shè)置透視距離和原點
13.1.10 3D平移
13.1.11 3D縮放
13.1.12 3D旋轉(zhuǎn)
13.1.13 透視函數(shù)
13.1.14 變形原點
13.1.15 背景可見
13.2 過渡動畫
13.2.1 設(shè)置過渡屬性
13.2.2 設(shè)置過渡時間
13.2.3 設(shè)置延遲過渡時間
13.2.4 設(shè)置過渡動畫類型
13.2.5 設(shè)置過渡觸發(fā)動作
13.3 幀動畫
13.3.1 設(shè)置關(guān)鍵幀
13.3.2 設(shè)置動畫屬性
13.4 案例實戰(zhàn)
13.4.1 設(shè)計圖形
13.4.2 設(shè)計冒泡背景按鈕
13.4.3 設(shè)計動畫效果菜單
13.4.4 設(shè)計照片特效
13.4.5 設(shè)計立體盒子
13.4.6 設(shè)計旋轉(zhuǎn)盒子
13.4.7 設(shè)計翻轉(zhuǎn)廣告
13.4.8 設(shè)計跑步效果
13.4.9 設(shè)計折疊面板
13.5 在線練習(xí)
第14章 使用CSS3媒體查詢
視頻講解:21分鐘
14.1 媒體查詢基礎(chǔ)
14.1.1 媒體類型和媒體查詢
14.1.2 @media
14.1.3 應(yīng)用@media
14.2 案例實戰(zhàn)
14.2.1 判斷顯示屏幕寬度
14.2.2 設(shè)計響應(yīng)式版式
14.2.3 設(shè)計響應(yīng)式菜單
14.2.4 設(shè)計自動隱藏布局
14.2.5 設(shè)計自適應(yīng)手機頁面
14.3 在線練習(xí)
第15章 使用JavaScript控制CSS樣式
視頻講解:1小時15分鐘
15.1 在網(wǎng)頁中使用JavaScript腳本
15.1.1 使用