Web標(biāo)準(zhǔn)設(shè)計

第一章 Web標(biāo)準(zhǔn)不是神話
1.1 理解Web標(biāo)準(zhǔn)
1.1.1 Web標(biāo)準(zhǔn)是什么
1.1.2 錯誤的思維
1.1.3 無障礙網(wǎng)頁倡議（WAI）
1.2 量化Web標(biāo)準(zhǔn)
1.2.1 大部分通過W3C校驗的網(wǎng)站只是偽標(biāo)準(zhǔn)
1.2.2 Web標(biāo)準(zhǔn)要求一覽表
1.2.3 是追求標(biāo)準(zhǔn)還是理解標(biāo)準(zhǔn)
1.3 為什么選擇Web標(biāo)準(zhǔn)
1.4 CSS為什么著火
1.4.1 CSS的作用
1.4.2 CSS 布局 VS. 表格布局
1.5 我能否學(xué)好Web標(biāo)準(zhǔn)
1.5.1 我需要具備什么素質(zhì)和條件才能學(xué)好Web標(biāo)準(zhǔn)
1.5.2 學(xué)習(xí)的重點與難點
1.6 欲善其事， 先利其器
1.6.1 軟件的選擇
1.6.2 調(diào)試環(huán)境
第二章 XHTML——瀏覽器上的新大陸
2.1 一切從語義開始
2.2 網(wǎng)頁的構(gòu)成
2.3 常見標(biāo)簽
2.3.1 標(biāo)題
2.3.2 內(nèi)容
2.3.3 列表
2.3.4 表格
2.3.5 表單
2.3.6 注釋
2.4 比HTML多出一個X
2.4.1 還多了什么
2.4.2 誰影響了網(wǎng)頁的樣子
2.4.2.1 瀏覽器的多模式
2.4.2.2 開啟通往標(biāo)準(zhǔn)的模式
2.4.3 堅持Strict Markup
2.4.4 語義化
2.5 按語義來分類
2.6 塊元素與內(nèi)聯(lián)元素
2.7 div不是神
2.7.1 合理應(yīng)用
2.7.1.1 嵌套
2.7.1.2 div不是table
2.7.2 div與span的差別
第三章 CSS——網(wǎng)頁美容師
3.1 語法結(jié)構(gòu)
3.1.1 基本結(jié)構(gòu)
3.1.2 樣式表中的注釋
3.1.3 字符轉(zhuǎn)義
3.2 選擇符的使用
3.2.1 通配選擇符
3.2.2 類型選擇符
3.2.3 包含選擇符
3.2.4 子對象選擇符
3.2.5 相鄰選擇符
3.2.6 屬性選擇符
3.2.6.1 匹配屬性和屬性值
3.2.6.2 類選擇符
3.2.7 ID選擇符
3.2.8 選擇符分組
3.3 偽元素與偽類
3.3.1 偽類
3.3.1.1 ：first-child偽類
3.3.1.2 鏈接偽類——：link 和 ：visited
3.3.1.3 動態(tài)偽類——：hover. ：active與：focus
3.3.1.4 語言偽類——：lang
3.3.2 偽對象
3.3.2.1 ：first-letter
3.3.2.2 ：first-line
3.3.2.3 ：before和 ：after
3.4 常用單位
3.4.1 長度單位
3.4.1.1 px vs. em
3.4.1.2 百分比單位
3.4.1.3 其他長度單位
3.4.2 顏色單位
3.5 應(yīng)用 CSS 在網(wǎng)頁上
3.5.1 鏈入外部樣式表
3.5.2 定義內(nèi)部樣式
3.5.3 定義內(nèi)聯(lián)定義
3.5.4 導(dǎo)入指定的外部樣式表
3.5.5 各種方式的差異
3.5.6 糟糕的手持設(shè)備
3.6 繼承與覆蓋
3.7 優(yōu)先權(quán)的計算
第四章 用XHTML和CSS來“擺”網(wǎng)頁
4.1 開始你的第一個頁面
4.2 文字的表現(xiàn)
4.2.1 字體的外型
4.2.2 顏色的定義
4.2.3 背景的定義
4.3 最簡單的布局
4.3.1 Margin 與 Padding
4.3.2 單列固定寬度居中
4.3.3 單列自適應(yīng)寬度
4.3.4 奇怪的高度
4.3.5 邊框的定義
4.4 郁悶的盒模型
4.5 文字旁邊的圖片
4.5.1 baseline
4.5.2 垂直對齊
4.5.3 圖片的浮動
4.6 列表的應(yīng)用
4.6.1 定義列表的外觀
4.6.2 導(dǎo)航菜單的應(yīng)用
4.6.3 列表的常見應(yīng)用
4.7 表格
4.7.1 表格的控制
4.7.2 為不同瀏覽器使用不同的選擇符
4.7.3 偽表格——看起來像， 其實卻不是表格
4.8 表單
4.8.1 樣式表單
4.8.2 表單元素的細(xì)節(jié)
4.8.3 注冊表單
第五章 布局之道
5.1 固定的左右分欄
5.1.1 經(jīng)典的三行兩列固定寬度的布局
5.1.2 兩列等高——背景偽造篇（一）
5.1.3 自由與未來
5.2 自適應(yīng)的左右分欄
5.2.1 經(jīng)典的三行兩列自適應(yīng)寬度的布局
5.2.2 兩列等高——背景偽造篇（二）
5.2.3 百分比的細(xì)節(jié)
5.2.4 clear：right與overflow
5.3 一欄固定寬度， 一欄自適應(yīng)寬度
5.3.1 單欄浮動
5.3.2 浮動的負(fù)值可以讓主要的內(nèi)容優(yōu)先顯示
5.3.3 Min & Max
5.4 多欄布局
5.4.1 三欄固定寬度和自適應(yīng)的布局
5.4.2 混合固定寬度和自適應(yīng)寬度的多欄布局
5.4.3 流出固定寬度的兩欄在自適應(yīng)寬度的中欄后面
5.4.4 偏移出來固定寬度的兩欄在自適應(yīng)寬度的中欄后面
5.5 組合之路
第六章 不要害怕各式各樣的瀏覽器
6.1 瀏覽器的市場
6.1.1 古老的IE5.x
6.1.1.1 IE5.x/win
6.1.1.2 IE5.x/mac
6.1.2 討厭的IE6
6.1.3 里程碑——IE7
6.1.4 新一代的IE4
6.1.5 開發(fā)利刃——Firefox
6.1.6 華麗的Oprea
6.1.7 異軍——Safari
6.2 兼容之道
6.2.1 條件注釋
6.2.2 過濾瀏覽器
6.2.3 破壞屬性
6.2.4 Hack之道
6.3 兼容問題
6.3.1 一切從浮動開始
6.3.2 Layout初體驗
6.3.3 閉合浮動元素
6.3.4 IE受不了浮動
6.3.4.1 浮動元素雙倍margin
6.3.4.2 消失的margin-bottom
6.3.4.3 砍掉的內(nèi)容
6.3.4.4 消失的內(nèi)容
6.3.4.5 多了一只“豬”
6.3.5 IE的其他問題
6.3.5.1 背景消失
6.3.5.2 背景原點
6.3.5.3 沒有內(nèi)容的內(nèi)容
6.3.5.4 消失的滾動條
6.3.5.5 更多的消失
6.3.6 Layout全接觸
6.3.6.1 默認(rèn)Layout元素
6.3.6.2 屬性觸發(fā)Layout
6.3.6.3 關(guān)于內(nèi)聯(lián)元素
6.3.6.4 重置hasLayout
6.3.6.5 引起問題
6.3.7 塊級格式化范圍（block formatting context）..
6.3.8 其他瀏覽器的問題
第七章 CSS常用技巧
7.1 滑動門技術(shù)
7.1.1 滑動門的原理
7.1.2 當(dāng)只有文字被放大時
7.1.3 一張圖片當(dāng)N個門使用
7.1.4 一些可能會被忽略的問題
7.1.5 其他的一些應(yīng)用
7.2 圓角
7.3 圖片的細(xì)節(jié)
7.3.1 載入中的圖片
7.3.2 加載不了的圖片
7.3.3 縮放的圖片
7.3.4 偽類縮放的圖片
7.4 被放大的文字
7.5 當(dāng)前標(biāo)識
7.5.1 視覺標(biāo)識
7.5.2 面包屑（Breadcrumbs）
7.5.3 操作步驟
7.6 居中元素
7.6.1 垂直居中多行文字
7.6.2 未知大小圖片在已知大小容器中垂直和水平居中
7.6.3 相對頁面垂直和水平居中已知大小的容器
7.7 隱藏的Tips會出現(xiàn)
7.7.1 實現(xiàn)原理
7.7.2 圖片信息
第八章 文字的藝術(shù)
8.1 中文的特殊性
8.2 縮放機制
8.2.1 縮放的文字
8.2.2 縮放的盒子
8.3 行高與基線
8.3.1 行高的細(xì)節(jié)
8.3.2 基線
8.3.3 文本空間
8.4 input里的文字
8.5 鏈接的范圍
8.5.1 額外的點擊空間
8.5.2 缺少的點擊空間
8.6 不間斷的文字
8.7 省略掉的文字
8.8 字體的介紹
8.8.1 中文字體
8.8.2 英文字體
8.9 語言會影響到字體
第九章 細(xì)品命名與微格式
9.1 命名規(guī)則
9.2 命名原則
9.3 不再陌生的 Microformats
9.3.1 認(rèn)識微格式
9.3.2 從微格式中提煉知識
9.4 ID與CLASS選擇誰
9.5 自定義標(biāo)簽
9.6 命名的重要性
第十章 換個思維來設(shè)計
10.1 消失了文字， 看到了彩虹
10.1.1 文字變成圖片的幾種方法
10.1.2 文字也可以用Flash來表現(xiàn)
10.2 用div代替html/ body
10.3 縮放的布局
10.3.1 實現(xiàn)原理
10.3.2 縮放一半
10.3.3 精準(zhǔn)em
10.4 網(wǎng)頁是可以用疊的
10.4.1 在一屏幕里顯示所有內(nèi)容
10.4.2 圖片的位置
10.4.3 position：absolute的層疊
10.5 百分比加減固定數(shù)值
10.5.1 50%+200px
10.5.2 50%-200px
10.6 兩列等高——margin負(fù)值篇
10.7 類display：inline-block的應(yīng)用
第十一章 隱藏在瀏覽器背后的CSS
11.1 (X)HTML與CSS校驗的意義
11.2 IE背后的善良
11.2.1 IE常見私有屬性
11.2.2 濾鏡
11.3 火狐貍的尾巴帶著CSS3的味道
11.3.1 At-rules 規(guī)則
11.3.2 Properties 屬性
11.3.3 Values 屬性值
11.4 其他瀏覽器的兼容方案
第十二章 JavaScript讓W(xué)eb動起來
12.1 概念
12.1.1 什么是JavaScript
12.1.2 ECMAScript是什么
12.1.3 什么是DOM
12.1.4 什么是BOM
12.1.5 想法
12.1.6 怎樣讓JavaScript運行
12.2 編程基礎(chǔ)
12.2.1 語法
12.2.2 變量
12.2.3 基本數(shù)據(jù)類型
12.2.3.1 數(shù)值
12.2.3.2 字符串
12.2.3.3 布爾型
12.2.4 表達(dá)式與運算符
12.2.4.1 算術(shù)運算符
12.2.4.2 關(guān)系運算符
12.2.4.3 邏輯運算符
12.2.4.4 賦值運算符
12.2.5 基本語句
12.2.5.1 條件語句
12.2.5.2 循環(huán)語句
12.2.6 函數(shù)
12.2.7 對象
12.3 DOM無處不在
12.3.1 把文檔表示為樹
12.3.2 樹的節(jié)點
12.3.3 節(jié)點的屬性
12.3.4 HTML DOM 特征
12.4 事件處理
12.4.1 什么是事件
12.4.2 Event對象
12.4.3 事件的綁定
12.4.4 分離
12.5 只要改變className就可以改變很多——下拉菜單的練習(xí)
12.5.1 結(jié)構(gòu)的選擇
12.5.2 分離實現(xiàn)效果
12.5.3 想法
12.6 表單的輔助
12.6.1 檢查數(shù)據(jù)
12.6.2 隱式提示
12.6.3 創(chuàng)建內(nèi)容——innerHTML VS createElement
12.6.4 setTimeout的用處
12.6.5 Ajax初體驗
12.6.6 HTML5的表單元素
12.7 class特效
第十三章 親 和 力
13.1 概念
13.2 Web內(nèi)容可訪問性指南
13.2.1 并非所有的內(nèi)容都是顯示的
13.2.2 保持原有功能的有效性
13.2.3 讓文字看得見
13.2.4 熱鍵操作
13.2.5 導(dǎo)航
13.2.6 標(biāo)題與內(nèi)容
13.2.7 語言與編碼
13.2.8 親和力聲明
13.2.9 建議
13.3 技術(shù)層上的一些親和力
13.3.1 如何讓鏈接變得更有表達(dá)能力
13.3.2 擴展鏈接的提示
13.3.3 節(jié)省步驟
13.3.4 圖片還是背景圖片
第十四章 XML的無限變化
14.1 XML的作用
14.1.1 XML能做什么
14.1.2 XML的表現(xiàn)
14.1.3 XML+CSS的表現(xiàn)
14.1.4 元素的語義
14.1.5 XSLT初體驗
14.2 XPath與XSLT
14.2.1 XPath簡介
14.2.2 XSLT應(yīng)用XPath
14.2.3 程序性轉(zhuǎn)換的XSLT
14.2.4 XSLT常見元素
14.2.5 XSLT函數(shù) document
14.2.6 XPath定位
14.2.6.1 定位路徑表達(dá)式
14.2.6.2 軸
14.2.6.3 節(jié)點測試
14.2.7 XPath基本表達(dá)式
14.2.8 XPath常見函數(shù)
14.2.9 X練習(xí)
14.3 華麗的RSS
14.3.1 復(fù)習(xí)
14.3.2 轉(zhuǎn)換時間格式的模板與參數(shù)的應(yīng)用
14.3.3 過濾與排序
14.3.4 背景色交替
14.3.5 顯示(X)HTML內(nèi)容
14.3.6 還能做什么？
14.4 XML的周邊與命運
14.4.1 XML Schema
14.4.2 WML
14.4.3 SVG
14.4.4 XML的未來
第十五章 簡單的實戰(zhàn)
15.1 創(chuàng)建開源社區(qū)系統(tǒng)OpenLab的首頁
15.1.1 分析結(jié)構(gòu)
15.1.2 疊出來的頭部
15.1.3 一張背景的導(dǎo)航
15.1.4 表格無敵
15.1.5 隱藏內(nèi)容
15.1.6 顯示的變化
15.2 Ao.A相冊
15.2.1 分析結(jié)構(gòu)
15.2.2 大背景
15.2.3 基本結(jié)構(gòu)
15.2.4 圖片展示
15.2.5 浮動的空白
15.2.6 小小的Tip提示
15.2.7 IE的兼容問題
15.2.8 放棄也是一種美！
15.2.9 精準(zhǔn)到px
15.2.10 讓網(wǎng)頁動起來——JavaScript
15.2.10.1 那JavaScript要應(yīng)用在哪些地方呢？
15.2.10.2 那使用JavaScript要注意什么呢？
15.2.11 讓網(wǎng)頁動起來——Flash
15.2.12 網(wǎng)頁并非會按我們所想的顯示
15.2.13 網(wǎng)頁并不一定要用瀏覽器看的
15.2.14 打印網(wǎng)頁
15.3 架構(gòu)前端
15.3.1 腳本框架
15.3.2 模塊化樣式表
15.3.3 模塊化(X)HTML
15.3.4 文件架構(gòu)
15.4 給自己做點什么
15.4.1 開始設(shè)計屬于你自己的網(wǎng)站
15.4.2 結(jié)構(gòu)與表現(xiàn)
15.4.3 華麗的效果源自哪里?
第十六章 最后的建議
16.1 思維的樂趣
16.1.1 堅持獨立思考
16.1.2 要善于自己發(fā)現(xiàn)和解決問題
16.1.3 不斷豐富知識， 提高所掌握知識的質(zhì)量
16.1.4 換個角度思考問題
16.2 減少重復(fù)開發(fā)的選擇
16.3 讓維護方便點
16.3.1 適當(dāng)?shù)淖⑨?br />16.3.2 API手冊
16.4 以后自學(xué)的方向
附錄