目 錄:
D1章 CSS3設計概述
視頻講解:36分鍾
1.1 認識CSS
1.1.1 CSS的發展曆史
1.1.2 CSS頁麵優勢
1.1.3 CSS在GN的早期實踐
1.2 認識Web標準
1.2.1 網頁結構
1.2.2 網頁錶現
1.2.3 網頁行為
1.3 案例:初次體驗CSS
1.4 CSS3簡介
1.4.1 CSS3模塊
1.4.2 CSS3新特性
1.4.3 CSS3現狀
1.4.4 給初學者的建議
1.4.5 瀏覽器支持
1.5 案例:設計完整的CSS頁麵
D2章 CSS3基本語法
視頻講解:32分鍾
2.1 CSS基本用法
2.1.1 CSS樣式
2.1.2 CSS應用
2.1.3 CSS樣式錶
2.1.4 導入外部樣式錶
2.1.5 CSS注釋
2.2 設置屬性
2.2.1 CSS屬性
2.2.2 定義屬性值
2.3 CSS特性
2.3.1 CSS層疊性
2.3.2 CSS繼承性
2.3.3 案例實戰
2.4 默認樣式
2.4.1 HTML4默認樣式
2.4.2 瀏覽器默認樣式
D3章 CSS3選擇器
視頻講解:71分鍾
3.1 選擇器概述
3.1.1 為什麼學習CSS3選擇器
3.1.2 CSS3選擇器分類
3.2 基本選擇器
3.2.1 標簽選擇器
3.2.2 類選擇器
3.2.3 ID選擇器
3.3 組閤選擇器
3.3.1 包含選擇器
3.3.2 子選擇器
3.3.3 相鄰選擇器
3.3.4 兄弟選擇器
3.3.5 分組選擇器
3.4 屬性選擇器
3.4.1 認識屬性選擇器
3.4.2 案例:設計圖片燈箱導航按鈕
3.4.3 案例:設計聯係錶單
3.4.4 案例:設計超鏈接樣式
3.5 僞類選擇器
3.5.1 認識僞類選擇器
3.5.2 動態僞類
3.5.3 結構僞類
3.5.4 否定僞類
3.5.5 狀態僞類
3.5.6 目標僞類
3.6 綜閤實戰:設計優雅的錶格
D4章 網頁文本美化
視頻講解:82分鍾
4.1 定義字體樣式
4.1.1 設置字體類型
4.1.2 使用通用字體
4.1.3 設置字體大小
4.1.4 案例:靈活配置網頁字體大小
4.1.5 設置字體顔色
4.1.6 案例:網頁配色
4.1.7 設置字體字形
4.2 定義文本樣式
4.2.1 文本水平對齊
4.2.2 案例:網頁居中顯示
4.2.3 案例:左右對齊欄目
4.2.4 文本垂直對齊
4.2.5 案例:設計JD居中顯示
4.2.6 案例:優化網頁居中顯示
4.2.7 設置行高
4.2.8 案例:設計可閱讀的正文行高
4.2.9 案例:靈活設計行高
4.2.10 案例:設計1行縮進
4.2.11 綜閤案例:文字隱藏和截取
4.3 CSS3文本樣式
4.3.1 CSS3文本模塊概述
4.3.2 設計文本陰影
4.3.3 案例:巧用文本陰影
4.3.4 案例:設計網站1頁
4.3.5 案例:定義溢齣文本
4.3.6 案例:文本換行
4.3.7 案例:添加動態內容
4.3.8 恢復默認樣式
4.3.9 自定義字體類型
D5章 網頁色彩和圖像美化
視頻講解:68分鍾
5.1 定義顔色
5.1.1 使用RGBA
5.1.2 使用HSL
5.1.3 使用HSLA
5.1.4 定義opacity屬性
5.1.5 定義transparent顔色值
5.2 定義漸變色
5.2.1 設計Webkit漸變
5.2.2 案例:應用漸變色1
5.2.3 設計Gecko漸變
5.2.4 案例:應用漸變色2
5.2.5 設計IE漸變
5.2.6 設計W3C漸變
5.2.7 案例:設計精緻按鈕
5.3 圖像美化
5.3.1 案例:定義照片相框
5.3.2 案例:為圖像設計陰影白邊效果
5.3.3 案例:設計水印
5.4 圖文混排
5.4.1 案例:行內圖文混排
5.4.2 案例:設計圖文環繞版式
5.4.3 案例:設計不規則的圖文環繞版式
5.5 案例實戰
5.5.1 設計網頁紋理背景
5.5.2 設計發光的球體
5.5.3 設計過渡色譜錶
D6章 網頁背景和邊框美化
視頻講解:75分鍾
6.1 設計邊框樣式
6.1.1 定義多色邊框
6.1.2 定義邊框背景
6.2 設計圓角
6.2.1 使用border-radius
6.2.2 案例:設計橢圓圖形
6.3 設計倒影
6.4 設計陰影
6.4.1 使用box-shadow
6.4.2 案例:設計Windows界麵效果
6.5 設計背景圖像
6.5.1 定義背景圖像重復顯示
6.5.2 案例:設計彈性公告欄
6.5.3 定位背景圖像
6.5.4 固定背景圖像
6.5.5 案例:使用背景圖像設計圓角
6.5.6 案例:僞列布局
6.6 CSS3新增背景圖像屬性
6.6.1 定義坐標
6.6.2 定義裁剪區域
6.6.3 定義大小
6.6.4 定義循環方式
6.6.5 定義多背景圖
6.7 案例實戰
6.7.1 設計圖標按鈕
6.7.2 設計花邊框
6.7.3 設計立體文本框
D7章 設計錶格和錶單
視頻講解:37分鍾
7.1 設計錶格
7.1.1 定義錶格
7.1.2 優化錶格
7.1.3 設置錶格屬性
7.2 定義錶格樣式
7.2.1 案例:隔行分色
7.2.2 案例:分欄樣式
7.2.3 案例:鼠標交互樣式
7.3 設計錶單
7.4 定義錶單樣式
7.4.1 設置基本樣式
7.4.2 案例:設計高亮錶單
7.4.3 案例:設計圖標化錶單
7.4.4 案例:設計易用錶單
7.4.5 案例:設計反饋錶
D8章 設計鏈接、列錶和菜單
視頻講解:60分鍾
8.1 設計超鏈接
8.1.1 定義基本樣式
8.1.2 案例:設計多樣超鏈接
8.1.3 案例:設計按鈕樣式
8.1.4 案例:設計圖像化樣式
8.1.5 案例:設計滑動樣式
8.2 設計列錶
8.2.1 列錶類型
8.2.2 正確使用列錶
8.3 定義列錶樣式
8.3.1 重置列錶樣式
8.3.2 定義項目符號
8.3.3 案例:自定義項目符號
8.3.4 案例:設計並列顯示的列錶
8.3.5 案例:定位列錶項目
8.3.6 案例:設計導航列錶
8.4 設計導航條
8.4.1 案例:使用背景圖設計導航條
8.4.2 案例:設計垂直導航條
8.4.3 案例:設計水平導航條
8.4.4 案例:設計多級菜單
8.4.5 案例:設計滑動門菜單
8.5 綜閤案例
8.5.1 排行榜
8.5.2 圖文列錶
D9章 CSS盒模型
視頻講解:56分鍾
9.1 CSS2盒模型概述
9.1.1 盒模型緣起
9.1.2 盒模型結構
9.1.3 定義盒模型大小
9.2 邊框
9.2.1 定義寬度
9.2.2 定義顔色
9.2.3 定義樣式
9.2.4 案例:設計行內元素邊框
9.3 邊界
9.3.1 定義邊界
9.3.2 案例:邊界的應用
9.3.3 案例:邊界重疊現象
9.3.4 行內元素邊界
9.4 補白
9.5 CSS3盒模型
9.5.1 定義盒模型顯示方式
9.5.2 定義盒模型可控大小
9.5.3 溢齣處理
9.5.4 定義輪廓
9.5.5 定義輪廓樣式
9.5.6 案例:改善網頁布局
D10章 CSS布局基礎
視頻講解:56分鍾
10.1 盒模型GJ概念
10.1.1 顯示類型
10.1.2 定位框
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.6 案例實戰
10.6.1 設計固寬 彈性頁麵
10.6.2 設計兩欄彈性頁麵
10.6.3 設計兩欄浮動頁麵
10.6.4 設計3欄彈性頁麵
10.6.5 設計兩列固寬 單列彈性頁麵
10.6.6 設計兩列彈性 單列固定頁麵
D11章 CSS3布局
視頻講解:79分鍾
11.1 多列布局
11.2 定義多列樣式
11.2.1 設置列寬
11.2.2 設置列數
11.2.3 設置列間距
11.2.4 設置列邊框樣式
11.2.5 設置跨列顯示
11.2.6 設置列高度
11.2.7 設置打印列
11.3 盒布局
11.4 定義盒布局樣式
11.4.1 設置自適應寬度
11.4.2 設置列顯示順序
11.4.3 設置列排列方嚮
11.4.4 設置模塊大小自適應
11.4.5 消除空白
11.4.6 設置對齊方式
11.4.7 小結
11.5 伸縮盒布局
11.5.1 定義Flexbox
11.5.2 定義伸縮方嚮
11.5.3 定義行數
11.5.4 定義對齊方式
11.5.5 定義伸縮項目
11.5.6 案例:設計伸縮盒菜單
11.5.7 案例:設計自適應伸縮頁
11.5.8 案例:設計混閤版伸縮頁麵
11.6 案例實戰
11.6.1 設計多列1頁
11.6.2 設計HTML5應用文檔
11.6.3 設計Windows 8桌麵
D12章 CSS兼容技法
視頻講解:33分鍾
12.1 瞭解主流瀏覽器
12.1.1 Mozilla
12.1.2 IE
12.1.3 Safari
12.1.4 Opera
12.1.5 Chrome
12.1.6 GN瀏覽器市場份額
12.1.7 IETester
12.2 CSS兼容方法
12.2.1 CSS過濾器
12.2.2 顯示模式
12.3 過濾樣式錶
12.4 過濾樣式
12.4.1 !important
12.4.2 下劃綫屬性名
12.4.3 * html選擇符
12.5 過濾聲明
12.5.1 隱藏單個聲明
12.5.2 隱藏多個聲明
12.5.3 推薦過濾器
12.6 使用檢測工具
12.6.1 W3C CSS驗證服務
12.6.2 Web Developer
12.6.3 代碼隔離與驗證
12.7 案例實戰
12.7.1 雙倍顯示
12.7.2 多齣3像素
12.7.3 高度不適應
12.7.4 多餘字符
12.7.5 定位異常
12.7.6 捉迷藏
12.7.7 百分比取值
12.7.8 丟失項目符號
12.7.9 內容溢齣
D13章 CSS文檔統籌與編碼規範
13.1 CSS文檔統籌
13.1.1 根據頁麵類型分離文件
13.1.2 根據功能模塊分離文件
13.1.3 根據標簽類型分離文件
13.1.4 根據設備類型分離文件
13.1.5 根據代碼規模分離文件
13.2 規則組織
13.3 屬性組織
13.3.1 按字母順序組織
13.3.2 按主次關係組織
13.3.3 按優先定義組織
13.4 CSS命名藝術
13.4.1 經典命名三法
13.4.2 CSS命名規則
13.4.3 CSS命名方法
13.5 CSS代碼縮寫
13.5.1 盒模型代碼簡寫
13.5.2 列錶和背景縮寫
13.5.3 顔色值縮寫
13.5.4 字體縮寫
13.6 CSS代碼格式
13.6.1 CSS代碼常用格式
13.6.2 CSS代碼格式工具
13.7 CSS代碼注釋
13.7.1 寫好注釋
13.7.2 預防Bug
13.7.3 CSS注釋清除
13.8 CSS代碼優化
13.8.1 利用繼承性優化代碼
13.8.2 利用默認值優化代碼
13.8.3 利用公共類優化代碼
13.8.4 利用選擇符分組優化代碼
13.8.5 利用層疊覆蓋優化代碼
D14章 CSS3動畫
視頻講解:72分鍾
14.1 認識Transform
14.2 2D變形
14.2.1 鏇轉
14.2.2 縮放
14.2.3 移動
14.2.4 傾斜
14.2.5 矩陣
14.2.6 案例:設計掛圖
14.2.7 定義變形原點
14.2.8 案例:漸變變形
14.3 3D變形
14.3.1 位移
14.3.2 縮放
14.3.3 鏇轉
14.3.4 矩陣
14.3.5 傾斜
14.3.6 案例:設計鏇轉的盒子
14.3.7 案例:設計翻轉廣告牌
14.4 過渡動畫
14.4.1 定義過渡屬性
14.4.2 定義過渡時間
14.4.3 定義延遲
14.4.4 定義過渡效果
14.4.5 定義觸發方式
14.4.6 定義硬件加速
14.4.7 案例:設計導航
14.5 運動動畫
14.5.1 定義關鍵幀
14.5.2 定義動畫名稱
14.5.3 定義動畫時間
14.5.4 定義播放方式
14.5.5 定義延遲時間
14.5.6 定義播放次數
14.5.7 定義播放方嚮
14.5.8 定義播放狀態
14.5.9 定義播放外狀態
14.5.10 案例:設計翻轉TX
14.5.11 案例:設計滑動的文字
14.6 案例實戰
14.6.1 設計3D盒子
14.6.2 設計可摺疊麵闆
14.6.3 設計滑動的DVD
14.6.4 設計多級菜單
D15章 CSS框架—Bootstrap
視頻講解:25分鍾
15.1 Bootstrap概述
15.1.1 Bootstrap發展曆史
15.1.2 Bootstrap構成模塊
15.1.3 Bootstrap主要特色
15.1.4 Bootstrap版本變遷
15.1.5 比較Bootstrap 2和Bootstrap 3
15.1.6 如何從Bootstrap 2升級到Bootstrap 3
15.1.7 瀏覽器支持
15.2 下載和定製Bootstrap 3
15.2.1 下載Bootstrap 3
15.2.2 定製Bootstrap 3
15.3 Bootstrap 3結構
15.3.1 源碼版Bootstrap 3文件結構
15.3.2 編譯版Bootstrap文件結構
15.4 安裝Bootstrap 3
15.4.1 本地安裝
15.4.2 在綫安裝
15.5 案例:使用Bootstrap 3
15.5.1 設計Bootstrap 3文檔模闆
15.5.2 設計交互組件
15.5.3 設計頁麵版式
D16章 使用Bootstrap 3優化CSS
視頻講解:51分鍾
16.1 頁麵排版優化
16.1.1 標題和字體風格
16.1.2 文本強調風格
16.1.3 文本對齊風格
16.1.4 縮略語風格
16.1.5 地址風格
16.1.6 引用風格
16.1.7 列錶風格
16.1.8 代碼風格
16.2 錶格優化
16.2.1 優化錶格結構
16.2.2 默認風格
16.2.3 錶格個性風格
16.2.4 錶格行風格
16.2.5 響應式錶格
16.3 錶單優化
16.3.1 Bootstrap 3支持的錶單控件
16.3.2 默認風格
16.3.3 布局風格
16.3.4 外觀風格
16.3.5 狀態風格
16.4 按鈕風格
16.4.1 默認風格
16.4.2 定製風格
16.4.3 狀態風格
16.5 圖片風格
16.6 使用工具類
16.6.1 小工具類
16.6.2 響應式工具
D17章 Bootstrap 3應用實戰
視頻講解:92分鍾
17.1 下拉菜單
17.1.1 快速體驗交互組件
17.1.2 設計下拉菜單
17.1.3 設置下拉菜單選項
17.2 按鈕組
17.2.1 設計按鈕組
17.2.2 設計按鈕導航條
17.2.3 設計按鈕布局和樣式
17.3 按鈕式下拉菜單
17.3.1 設計按鈕式下拉菜單
17.3.2 設計分隔樣式
17.3.3 設計按鈕式下拉菜單布局
17.4 導航
17.4.1 設計導航組件
17.4.2 設置導航選項
17.4.3 綁定導航和下拉菜單
17.4.4 激活標簽頁
17.5 導航條
17.5.1 設計導航條
17.5.2 綁定對象
17.5.3 導航條布局
17.6 麵包屑和分頁
17.6.1 設計麵包屑
17.6.2 設計分頁組件
17.6.3 設置分頁選項
17.6.4 設計翻頁組件
17.7 標簽與徽章
17.8 縮略圖
17.8.1 關於圖像占位符
17.8.2 設計縮略圖
17.9 警告框
17.9.1 設計警告框
17.9.2 添加關閉按鈕
17.9.3 添加鏈接
17.10 進度條
17.10.1 設計進度條
17.10.2 設置個性進度條
17.11 媒體
17.11.1 媒體版式
17.11.2 媒體列錶
17.12 版式
17.12.1 大屏幕區塊
17.12.2 頁麵標題
17.12.3 列錶組
17.12.4 麵闆
17.12.5 Well
17.13 輸入框
17.13.1 綴飾文本框
17.13.2 設計尺寸
17.13.3 按鈕文本框
17.13.4 按鈕式下拉菜單
17.13.5 分段按鈕下拉菜單
17.14 字體圖標
D18章 CSS柵格係統
視頻講解:22分鍾
18.1 柵格係統概述
18.1.1 柵格係統基礎
18.1.2 設計柵格係統
18.1.3 柵格係統應用優勢
18.2 Bootstrap柵格係統
18.3 案例實戰
18.3.1 設備類型
18.3.2 設備優先化柵格
18.3.3 固定柵格和流式柵格
18.3.4 柵格堆疊和水平排列
18.3.5 列偏移
18.3.6 列嵌套
18.3.7 列排序
D19章 CSS響應式設計
視頻講解:28分鍾
19.1 響應式設計概述
19.1.1 響應式設計緣起
19.1.2 響應式設計流程
19.2 設計響應式圖片
19.3 定義設備類型
19.3.1 Media Queries模塊概述
19.3.2 認識@media規則
19.3.3 使用@media規則
19.3.4 案例:設計響應式頁麵
19.4 設計響應式布局
19.5 自適應顯隱控製
19.6 綜閤案例:設計響應式頁麵
D20章 CSS動態樣式
20.1 認識LESS
20.1.1 LESS概述
20.1.2 LESS優勢
20.1.3 LESS參考和工具
20.2 如何使用LESS
20.2.1 在客戶端使用LESS
20.2.2 在服務器端使用LESS
20.3 LESS組成
20.3.1 LESS基本特性
20.3.2 LESS主要功能
20.3.3 比較LESS和SASS
20.4 LESS動態語法
20.4.1 變量
20.4.2 混閤
20.4.3 參數混閤
20.4.4 模式匹配
20.4.5 條件錶達式
20.4.6 嵌套規則
20.4.7 運算
20.4.8 Color函數
20.4.9 Math函數
20.4.10 作用域
20.4.11 命名空間
20.4.12 注釋
20.4.13 導入
20.4.14 字符串插值
20.4.15 轉義字符
20.4.16 錶達式
20.5 綜閤案例:在Bootstrap 3中使用LESS
D21章 企業&公司類型網站
視頻講解:48分鍾
21.1 産品策劃
21.2 設計圖
21.3 切圖
21.4 網站重構
21.5 網站布局
D22章 旅遊休閑類型網站
視頻講解:47分鍾
22.1 産品策劃
22.2 設計圖
22.3 切圖
22.4 網站重構
22.5 網站布局
D23章 時尚娛樂類型網站
視頻講解:35分鍾
23.1 産品策劃
23.2 設計圖
23.3 切圖
23.4 網站重構
23.5 網站布局
D24章 新聞谘詢類型網站
視頻講解:55分鍾
24.1 産品策劃
24.2 設計圖
24.3 切圖
24.4 網站重構
24.5 網站布局
顯示全部信息構建CSS係統的D一步是要規劃好CSS文件結構。一般網站CSS樣式文件會被分為主文件和分類文件,在CSS主文件中可以定義所有頁麵公共屬性,如網站默認字體、鏈接、頁眉、頁腳和公共類等,同時還會包含各種被分離的CSS文件鏈接。下麵介紹如何閤理地分離樣式錶文件,實現科學分類並優化CSS文件。
這種思路是根據不同類型頁麵分離CSS樣式錶文件。例如,根據網站的1頁、頻道頁麵和詳細頁設計不同的樣式錶文件。這樣每個頁麵都會有屬於自己的CSS文件。D網站頁麵類型比較單純,顯示樣式又比較統一時,選擇這種方案FC理想,它簡單明瞭、行之有效,如一些企業網站J比較適閤,基本上用幾個網頁模闆J可以實現網站的整體建設。
D頁麵結構比較復雜、頁麵類型不統一時,例如每個頻道頁的樣式都不盡相同,頻道頁、詳細頁顯示效果韆變萬化,使用這種思路分離CSS文件J會很麻煩。
þ 解決途經
把不同的頁麵公共樣式存放在主樣式錶文件中,然後分彆為不同頁麵定義屬於自己的樣式錶文件,雖然這不是ZJ方案,但卻比較適用。
þ 存在風險
如果網站係統龐大,這種解決途經會存在一定風險,因為係統龐大,公共樣式必定很多,把如此多的樣式都放在CSS主文件中,會造成主文件FC龐大,違背瞭CSS文件分離的初衷,D頁麵被加載時,會下載很多用不上的樣式代碼。
同時在不同類型的頁麵內分彆編寫代碼,CSS文件中各放一份樣式代碼,也容易産生代碼冗餘,對後期維護不利。
這種思路是根據頁麵中不同模塊來分離CSS文件。例如,根據頁眉、頁腳、導航條、功能塊、新聞塊等分彆設計不同的CSS文件,這樣J可以根據頁麵模塊組成分彆導入不同的樣式錶文件,這個方法比較簡單,編寫的代碼會很乾淨,導入文件時有的放矢,下載速度比較塊。
但這種方法也會産生很多個很小的CSS文件。例如,導航條可能隻需要十幾行CSS代碼,這樣單D創建一個樣式錶會顯得有點多餘。而且每個頁麵可能包含很多模塊,這樣J導緻每個頁麵都包含一堆CSS文件,給管理帶來一定麻煩。
這種思路是根據HTML標簽的不同類型來分離CSS文件。例如,把與Form錶單相關的樣式代碼放在一個文件中,把與a相關的鏈接樣式放在另一個文件中,如此等等。
這個方法比較直觀、實用。與根據模塊分類類似。如果網站共有50個頁麵,其中12個含有Form,那麼可以創建一個CSS文件專門處理Form的樣式,隻在這12個頁麵導入它。如果另外20個頁麵含有列錶,J創建一個文件專門處理列錶樣式。
根據標簽類型分離文件會使樣式錶文件變得很細碎,一個頁麵有時會導入很多個樣式錶文件,顯得比較繁瑣。
隨著樣式在打印、手提設備等方麵的不斷普及應用,這種分類方式逐漸被設計師所青睞。例如,可以根據打印、手持設備和屏幕等多種媒體類型設計不同的樣式文件,這樣能夠使頁麵適用不同設備類型,設計師也可以快速轉換頁麵,以適用網頁從屏幕到其他設備的延伸,同時將為設計師節省大量的時間和精力。例如在上麵示例中J可以看到Adobe公司網站設計師J是根據不同設備分離樣式錶的。
這種方法是對前麵幾種方法的綜閤,設計師可以根據代碼規模和意圖,綜閤利用上麵介紹的方法,實現CSS代碼的有機分離。例如,如果網站錶單的樣式比較多,可以把它單D放在一個CSS文件中,如果某個功能模塊使用頻率比較高,且樣式比較多時,可以考慮把它存放在一個文件中,如果頻道頁麵樣式統一,不妨定義一個頻道樣式文件,如此等等。
D然,這種方法也會使網站樣式文件結構顯得比較淩亂,有時會妨礙設計師之間的交流和理解。
關於CSS文件分離技術,讀者也可以根據實際情況適D變通或創新。另外,使用@import語句可以在一個CSS文件或HTML文檔中包含很多其他樣式錶文件。因此,設計師J可以細緻分離樣式文件,再通過組閤並用@import語句把需要的文件導入到一個新的CSS文件,這樣J隻需要把這個新的包含文件導入到不同網頁中J可以實現統一管理。用這種方法可以創建網站的主CSS文件,或者實現CSS文件的多種組閤,實現代碼的充分利用。D網站每個頁麵都導入很多個不同的CSS文件,應該考慮使用這種方法。
構建網站樣式錶文件體係之後,用戶J可以打開每個文件編寫樣式瞭。但需要考慮先定義哪些樣式,後定義哪些樣式,選擇符之間又如何分組等。
規則(即樣式)的排列順序似乎沒有固定規律,但養成好的書寫習慣能夠幫助用戶查找與維護樣式。好的習慣總是先定義元素基本屬性,或者是定義元素默認屬性,然後定義id選擇符樣式,一般多指布局屬性定義,Z後是class選擇符定義的公共屬性,也可以把class選擇符定義的常用類放在基本元素默認屬性的後麵。
在設計網頁布局樣式時,有兩種方案:
D一種,是根據網頁模塊的布局順序從上到下定義。
【示例1】下麵文件的選擇符梗概( 禪意花園的主頁(http://www.csszengarden.com/)樣式錶文件,總體上是先定義元素基本屬性,然後定義id布局屬性,Z後是公共類,布局屬性又以模塊化從上到下逐步定義。 顯示全部信息剛拿到這本《CSS3網頁設計從入門到精通(含光盤)》,光是厚度就讓我對裏麵的內容有瞭初步的信心。我一直覺得網頁設計最吸引我的地方就是它的視覺錶現力,而CSS3的齣現無疑是給網頁注入瞭更多生命力的技術。 翻開書,首先注意到的是排版設計。字體清晰,代碼塊的顔色區分得當,閱讀起來非常舒服,不會像有些技術書籍那樣枯燥乏味。章節的劃分也比較閤理,從基礎的CSS語法、選擇器,到更復雜的布局模型(Flexbox、Grid),再到各種高級效果,邏輯性很強。我之前也接觸過一些CSS,但總覺得零散,這本書的結構讓我感覺能夠係統地梳理和鞏固我的知識。 書裏提到的“光盤”,對我來說是個驚喜。現在很多書籍都隻提供在綫鏈接,或者提供一些非常簡單的代碼片段,但有光盤就意味著更豐富的資源,比如完整的示例項目、更詳細的代碼注釋,甚至可能還有一些作者錄製的視頻講解。我會好好利用光盤裏的內容,跟著書本一起實踐,這樣學習效果肯定會事半功倍。 我比較關注的是書中關於響應式設計的講解。現在做網頁,不考慮移動端適配基本上就是白費功夫。這本書能從“入門”到“精通”這個過程,說明它應該會涵蓋從基礎的媒體查詢,到更現代的流式布局、Flexbox和Grid在響應式設計中的應用。我希望能夠學到如何在不同設備上都能呈現齣最佳視覺效果和用戶體驗的設計技巧。 另外,我對書中關於CSS3的動畫和過渡效果非常感興趣。如何讓一個網頁“動起來”,並且是那種恰到好處、不喧賓奪主但又能吸引眼球的動,這是我一直想掌握的。這本書能夠從“精通”這個角度切入,說明它應該會包含很多進階的技巧,不僅僅是簡單的hover效果,可能還有更復雜的動畫序列、3D變換等,這讓我非常期待!
评分剛看到《CSS3網頁設計從入門到精通(含光盤)》這本書的時候,就被它紮實的內容所吸引。我一直認為,學習一項技術,打好基礎是關鍵,而這本書從“入門”到“精通”的定位,恰好滿足瞭我對係統學習的需求。 拿到書後,我首先瀏覽瞭目錄,發現內容非常全麵,從最基礎的CSS語法、盒模型,到現代網頁設計不可或缺的Flexbox和Grid布局,再到各種酷炫的動畫、過渡效果,以及一些高級的CSS3特性,幾乎涵蓋瞭CSS3的方方麵麵。這種結構化的知識體係,讓我覺得學習起來會非常有條理,不會像零散地看一些網絡教程那樣容易遺忘或混淆。 書配有光盤,這對我來說絕對是個大加分項。我喜歡邊學邊練,有光盤就意味著我可以獲得書中所有示例代碼的完整版本,甚至可能包含一些高質量的項目模闆。這能極大地節省我查找和復製代碼的時間,讓我能更專注於理解代碼背後的原理和實現思路。我計劃跟著光盤裏的例子,一步一步地敲齣屬於自己的作品,鞏固所學知識。 我特彆希望書中關於響應式網頁設計的部分能有詳細的講解。現在用戶越來越傾嚮於在手機上瀏覽網頁,如何讓網頁在不同設備上都能有良好的顯示效果,是每個網頁設計師必須掌握的技能。我期待這本書能夠深入介紹如何利用CSS3的媒體查詢、流式布局、彈性盒子模型等技術,實現優雅的響應式設計。 此外,我對書中關於CSS3的各種視覺效果和交互動畫部分也充滿期待。例如,如何實現平滑的過渡動畫,如何創建富有錶現力的過渡效果,如何利用CSS3的動畫屬性製作齣引人入勝的動態效果。我相信通過這本書的學習,我能夠掌握如何為網頁增添更多活力和創意,提升用戶體驗,讓我的設計作品更具競爭力。
评分終於拿到這本書瞭!一直以來都對CSS3的新特性和各種酷炫的動畫效果心生嚮往,但苦於基礎不牢,總覺得無從下手。看到這本《CSS3網頁設計從入門到精通(含光盤)》的介紹,感覺正是我的“救星”! 包裝挺有質感的,拿在手裏沉甸甸的,這讓我對內容充滿瞭期待。迫不及待地翻開,首先映入眼簾的是清晰的目錄。從最基礎的CSS選擇器、盒子模型講起,然後逐步深入到Flexbox、Grid布局,再到動畫、過渡、濾鏡等等,感覺知識體係搭建得非常完整。尤其是看到“響應式設計”和“移動優先”等章節,簡直是為我量身定做的,現在做網頁不考慮移動端簡直是落伍瞭。 我平時比較喜歡邊學邊練,這本書配有光盤,這簡直是太方便瞭!不用去網上到處找示例代碼,直接跟著書上的例子一步步敲,肯定能學得更快。而且,光盤裏的代碼應該都經過瞭作者的精心組織和測試,質量上肯定有保證。我打算先從光盤裏的基礎案例開始,熟悉每一個知識點,然後再嘗試著去改寫、擴展,創造屬於自己的小項目。 說實話,我之前嘗試過看一些網上的教程,但感覺零散且不成體係,遇到問題的時候往往不知道該從哪裏找答案。而這本書從“入門”到“精通”,這個循序漸進的路徑設計,讓我覺得非常安心。哪怕我隻是一個CSS小白,也能一步步跟上作者的思路,最終掌握CSS3的精髓。光是目錄和前幾章的瀏覽,就已經讓我信心倍增瞭! 我最期待的還是關於CSS3動畫和過渡的部分。現在很多網站的設計都離不開這些動態效果,它們能極大地提升用戶體驗,讓網頁更加生動有趣。這本書裏專門闢齣章節講解,並且應該有大量的實戰案例,我希望能夠從中學習到如何製作流暢、自然的動畫,並且掌握一些高級的技巧,比如關鍵幀動畫、3D變換等。能把這些“高大上”的效果融會貫通,我想我的網頁設計水平一定會有一個質的飛躍!
评分拿到這本《CSS3網頁設計從入門到精通(含光盤)》的時候,我最直接的感受就是它的“實在”。厚度適中,拿在手裏有分量,這意味著內容肯定很充實,而不是那種“薄薄一本講不清楚”的書。 我之前接觸過一些CSS,但總覺得自己的功底不夠紮實,特彆是在處理復雜的布局和實現精細的動畫效果時,常常力不從心。看到這本書的目錄,從基礎的選擇器、屬性,到 Flexbox、Grid 這種現代布局的核心技術,再到後麵令人眼花繚亂的過渡、動畫、3D轉換等,感覺整個CSS3的知識體係都被囊括進來瞭。這種係統性的講解,對我來說非常有吸引力。 我尤其喜歡它“含光盤”的設計。現在很多綫上教程雖然方便,但代碼的整理和歸檔總是不夠係統,而且經常存在版本不一緻的問題。有一張實實在在的光盤,裏麵包含大量的示例代碼、項目文件,甚至可能還有一些實用的素材,這對於我這樣喜歡動手實踐的學習者來說,簡直是福音。我可以直接下載下來,然後在自己的開發環境中運行、修改、調試,這樣學習的效率會大大提高。 我非常期待書中關於響應式設計的講解。在移動互聯網時代,網頁的響應式設計已經不是可選項,而是必選項。我希望這本書能從原理到實踐,詳細講解如何利用CSS3的媒體查詢、彈性盒子模型、網格布局等技術,製作齣在各種屏幕尺寸下都能完美呈現的網頁。這對於我目前正在做的項目來說,至關重要。 另外,書中關於CSS3的各種視覺效果和動畫的篇幅,我也非常期待。如何用CSS3實現一些更具創意和吸引力的視覺元素,比如平滑的過渡動畫、炫酷的粒子效果、甚至是一些遊戲化的交互體驗,這些都是我希望從中學習到的。我希望能通過這本書,讓我的網頁設計不僅僅是“能用”,而是“好看”、“好玩”,並且能給用戶留下深刻的印象。
评分這本書的封麵設計相當吸引人,簡潔大氣,符閤我對於一本專業技術書籍的期待。當我拿到《CSS3網頁設計從入門到精通(含光盤)》這本書後,迫不及待地翻閱瞭目錄,感覺編排思路非常清晰。 我最看重的是它循序漸進的學習路徑。我雖然對網頁設計有熱情,但CSS基礎相對薄弱,經常在各種布局和樣式調整中感到睏惑。這本書從最基礎的CSS語法、選擇器開始講解,逐步過渡到盒子模型、浮動布局(雖然已經不是主流,但理解原理也很重要),然後深入到Flexbox和Grid這兩大現代布局神器。這種由淺入深的講解方式,讓我覺得即便是初學者也能輕鬆上手。 光盤的配置更是錦上添花。作為一個實踐型的學習者,我非常需要有大量的示例代碼來輔助理解。光盤裏的內容,我預計會包含書本中所有案例的完整代碼,甚至可能還有一些額外的素材或者完整的項目模闆。這對我來說,意味著可以更高效地進行模仿學習,並在此基礎上進行個性化的修改和創新,而不是僅僅停留在理論層麵。 我特彆關注的是書中關於“精通”的部分。既然有“精通”二字,我期望它能夠涵蓋一些更高級的CSS3特性,例如CSS變量、calc()函數、blend-mode、filter等,這些都能讓網頁的設計效果更加豐富和獨特。我也希望書中能夠講解一些優化網頁性能的小技巧,畢竟技術再炫酷,如果加載速度慢,用戶體驗也會大打摺扣。 而且,書中應該會涉及一些當下非常流行的設計趨勢,比如微交互、漸變背景、毛玻璃效果等。我希望能通過這本書,掌握如何運用CSS3的強大功能,將這些流行元素巧妙地融入到我的網頁設計中,讓我的作品在視覺上更加齣彩,更能吸引用戶的目光。
本站所有內容均為互聯網搜索引擎提供的公開搜索信息,本站不存儲任何數據與內容,任何內容與數據均與本站無關,如有需要請聯繫相關搜索引擎包括但不限於百度,google,bing,sogou 等
© 2025 tushu.tinynews.org All Rights Reserved. 求知書站 版权所有