響應式Web設計：HTML5和CSS3實踐指南

譯者序
作者簡介
審校者簡介
前言
第1章　響應式元素及媒介 / 1
1.1　簡介 / 2
1.2　基于寬度百分比的圖像縮放 / 2
1.3　基于cookie及JavaScript的響應式圖像 / 5
1.4　使視頻自適應于屏幕寬度 / 8
1.5　基于媒介查詢的圖像縮放 / 11
1.6　基于媒介查詢的動態(tài)導航欄 / 13
1.7　基于尺寸的響應式內邊距 / 18
1.8　基于CSS3按鈕的進度條 / 19
第2章　響應式字體 / 25
2.1　簡介 / 26
2.2　創(chuàng)建自適應的響應式字體 / 26
2.3　使用畫布實現文本陰影 / 28
2.4　使用畫布實現內側陰影和外側陰影 / 30
2.5　使用畫布旋轉文本 / 32
2.6　使用CSS3旋轉文本 / 33
2.7　使用CSS3制作3D文本 / 35
2.8　基于文本遮罩的文本紋理 / 37
2.9　基于位置偽類的交替行樣式 / 39
2.10　基于before及after偽元素添加字符 / 41
2.11　基于相對字體大小的按鈕 / 42
2.12　為字體添加陰影效果 / 45
2.13　基于邊框半徑的圓角實現 / 47
第3章　響應式布局 / 51
3.1　簡介 / 52
3.2　基于min-width和max-width屬性的響應式布局 / 52
3.3　基于相對內邊距的布局控制 / 55
3.4　為CSS添加媒介查詢 / 58
3.5　基于媒介查詢創(chuàng)建響應式寬度布局 / 62
3.6　基于媒介查詢改變圖片大小 / 68
3.7　基于媒介查詢隱藏元素 / 70
3.8　創(chuàng)建平滑過渡的響應式布局 / 72
第4章　使用響應式框架 / 84
4.1　簡介 / 85
4.2　使用流式960網格布局 / 85
4.3　使用Blueprint網格布局 / 90
4.4　基于三分法的流式布局 / 95
4.5　響應式960網格框架—Gumby / 101
4.6　易上手的Bootstrap框架 / 107
第5章　設計移動設備優(yōu)先的Web應用 / 115
5.1　簡介 / 116
5.2　使用Safari開發(fā)者工具的用戶代理設置 / 116
5.3　通過Chrome插件設置用戶代理 / 120
5.4　使用插件調整瀏覽器窗口大小 / 123
5.5　學習視窗及其相關選項 / 124
5.6　為jQuery Mobile添加標簽 / 128
5.7　基于jQuery Mobile添加子頁面 / 132
5.8　基于jQuery Mobile制作列表元素 / 135
5.9　基于jQuery Mobile開發(fā)具有移動設備外觀的按鈕 / 143
5.10　僅通過媒介查詢?yōu)橐苿釉O備設置移動版本的樣式表 / 150
5.11　僅為移動設備添加JavaScript功能特效 / 152
第6章　優(yōu)化響應式內容 / 155
6.1　簡介 / 156
6.2　使用IE開發(fā)者工具進行響應式測試 / 156
6.3　瀏覽器測試—使用插件 / 160
6.4　開發(fā)環(huán)境—使用免費IDE / 166
6.5　虛擬化—下載VirtualBox / 169
6.6　在Chrome中使用瀏覽器縮放工具 / 174
第7章　非侵入式JavaScript / 178
7.1　簡介 / 179
7.2　基于非侵入式JavaScript編寫“Hello World” / 179
7.3　基于事件監(jiān)聽器創(chuàng)建發(fā)光效果的“提交”按鈕 / 183
7.4　制作鼠標懸停后的按鈕突出效果 / 189
7.5　基于非侵入式jQuery改變頁面元素大小 / 193
7.6　基于非侵入式JavaScript的密碼遮罩 / 197
7.7　基于事件監(jiān)聽器實現圖像陰影的動態(tài)效果 / 201