CSS3實(shí)戰(zhàn)：開發(fā)與設(shè)計(jì)

定　價(jià)：￥59.00

作　者：	Chris Mills
出版社：	機(jī)械工業(yè)出版社
叢編項(xiàng)：
標(biāo)　簽：	HTML XML 程序設(shè)計(jì) 計(jì)算機(jī)/網(wǎng)絡(luò)

購買這本書可以去

ISBN：	9787111426516	出版時(shí)間：	2013-06-01	包裝：	平裝
開本：	16	頁數(shù)：	280	字?jǐn)?shù)：

內(nèi)容簡介

　　全書共8章：第1章簡單介紹了CSS3的重要更新、現(xiàn)代Web設(shè)計(jì)的理念以及常用的CSS3特性；第2章講解了如何利用HTML5和JavaScript構(gòu)建堅(jiān)實(shí)的跨瀏覽器模板；第3章詳細(xì)介紹了CSS3中新增的字體、文本、排版方面的特性；第4章講解了CSS3新增的各種與盒子相關(guān)的特性；第5章和第6章分別講解了CSS3的動(dòng)畫特性以及如何利用CSS3生成圖標(biāo)；第7章則介紹了CSS3中新增的與排版和布局相關(guān)的特性，以及如何利用CSS3進(jìn)行排版和布局；第8章以迭代的方式完成了貫穿全書的一個(gè)完整案例，介紹了媒介查詢、viewport、自適應(yīng)圖片和視頻技術(shù)等內(nèi)容，旨在幫助讀者將理論知識(shí)貫穿于實(shí)踐中，迅速成為新一代Web開發(fā)技術(shù)中的弄潮兒。

作者簡介

　　ChrisMills　資深Web開發(fā)工程師、開放Web標(biāo)準(zhǔn)的布道者，從事Web開發(fā)多年，對(duì)各種Web開發(fā)技術(shù)都有非常深入的研究，尤其是HTML5與CSS3，經(jīng)驗(yàn)極其豐富。目前就職于Opera公司，是Opera網(wǎng)絡(luò)標(biāo)準(zhǔn)課程的創(chuàng)立者，同時(shí)也是W3C網(wǎng)絡(luò)教育社區(qū)組的聯(lián)職主席。他還為dev.opera.com、.netmagazine、A List Apart等網(wǎng)站編寫開放標(biāo)準(zhǔn)，并在高校和全球行業(yè)會(huì)議上發(fā)表相關(guān)演講。

圖書目錄

目　　錄
譯者序
CSS3歡迎你
致　謝
第1章　CSS3和現(xiàn)代Web設(shè)計(jì) / 1
1.1　為什么要使用CSS3 / 2
1.2　現(xiàn)代Web設(shè)計(jì)理念 / 3
1.2.1　可訪問性第一 / 3
1.2.2　可用性其次 / 5
1.2.3　優(yōu)雅降級(jí)和漸進(jìn)增強(qiáng) / 5
1.3　對(duì)內(nèi)容的思考過程 / 6
1.4　本書中的CSS3模塊 / 7
1.5　常用CSS3特性 / 9
1.5.1　廠商前綴 / 9
1.5.2　CSS3顏色 / 11
1.5.3　用rem調(diào)整文本大小 / 13
1.5.4　CSS3選擇器 / 15
小結(jié) / 24
第2章　利用HTML5與JavaScript構(gòu)建堅(jiān)實(shí)的跨瀏覽器模板 / 25
2.1　從HTML5語義開始 / 26
2.1.1　為什么用HTML5 / 26
2.1.2　HTML5錯(cuò)誤處理 / 27
2.2　建立模板 / 28
2.2.1　HTML5的DOCTYPE / 28
2.2.2　語言和基本文檔綱要 / 29
2.2.3　定義文檔字符集 / 29
2.2.4　XHTML5和代碼風(fēng)格 / 30
2.2.5　為HTML5語義元素添加跨瀏覽器支持性 / 30
2.3　校驗(yàn)HTML5 / 32
2.4　探索HTML5元素 / 33
2.4.1　<audio>與<video> / 34
2.4.2　<article>與<section> / 36
2.4.3　<header>與<footer> / 38
2.4.4　<aside> / 38
2.4.5　<nav> / 39
2.4.6　<hgroup> / 39
2.4.7　<figure>與<figcaption> / 40
2.4.8　<time> / 40
2.4.9　<mark> / 42
2.4.10　HTML5表單元素 / 42
2.4.11　<canvas> / 44
2.5　CSS重置和normalize.css / 45
2.6　JavaScript庫綜述 / 46
2.6.1　css3-mediaqueries-js / 46
2.6.2　CSS3PIE / 47
2.6.3　Modernizr / 48
2.6.4　Selectivizr / 48
2.7　IE條件注釋 / 48
小結(jié) / 50
第3章　讓字體和文本變得有趣 / 51
3.1　蟒蛇來啦 / 52
3.2　使用Web字體 / 53
3.2.1　給示例使用Web字體 / 54
3.2.2　Web-Font問題 / 56
3.2.3　Windows渲染問題 / 59
3.2.4　商用字體服務(wù) / 62
3.3　CSS3文本爭執(zhí) / 64
3.3.1　文本陰影 / 65
3.3.2　控制文本溢出 / 67
3.3.3　word-wrap打破長單詞 / 68
3.3.4　控制斷字 / 69
3.4　CSS3排版 / 70
3.4.1　基于Web的連寫和文本渲染優(yōu)化 / 71
3.4.2　啟用Web高級(jí)的字體特性font-feature-settings / 72
3.4.3　連寫和自由連寫 / 73
3.4.4　數(shù)字、分?jǐn)?shù)和序數(shù) / 73
3.4.5　小型大寫字母和小號(hào)大寫字母 / 75
3.4.6　字距調(diào)整 / 76
3.4.7　樣式集和其他組合效果 / 76
3.4.8　font-feature用途的小貼士 / 77
小結(jié) / 78
第4章　CSS3修飾的增強(qiáng)盒子 / 79
4.1　CSS3修飾的光明前景 / 80
4.2　border-radius：圓角的福音 / 82
4.3　使用box-shadow添加立體效果 / 85
4.4　用CSS漸變來修飾 / 88
4.4.1　線性漸變 / 88
4.4.2　徑向漸變 / 92
4.4.3　為舊版IE提供漸變支持 / 98
4.5　多重背景 / 99
4.6　構(gòu)思巧妙的盒子：border-image / 101
4.7　box-decoration-break / 106
4.8　給橫幅廣告添加修飾 / 107
4.8.1　構(gòu)建基礎(chǔ) / 107
4.8.2　添加CSS3火花 / 109
4.8.3　支持舊版瀏覽器 / 110
4.8.4　改進(jìn)廣告 / 110
小結(jié) / 111
第5章　用CSS3制作動(dòng)畫效果 / 112
5.1　CSS動(dòng)畫 / 113
5.2　變形 / 114
5.2.1　2D變形 / 115
5.2.2　3D變形 / 121
5.3　過渡 / 134
5.3.1　選擇過渡的元素 / 135
5.3.2　選擇過渡持續(xù)時(shí)間 / 136
5.3.3　過渡延遲時(shí)間 / 136
5.3.4　過渡的速率變化 / 136
5.3.5　過渡簡寫及多重過渡 / 141
5.4　動(dòng)畫 / 142
5.4.1　建立基本動(dòng)畫 / 142
5.4.2　給元素應(yīng)用動(dòng)畫 / 144
5.4.3　設(shè)置動(dòng)畫持續(xù)時(shí)間 / 145
5.4.4　調(diào)整動(dòng)畫的速率 / 146
5.4.5　增加延遲時(shí)間 / 147
5.4.6　選擇animation-direction:back還是forth / 147
5.4.7　animation-fill-mode / 148
5.4.8　簡寫和多重動(dòng)畫 / 148
5.5　用動(dòng)畫提升橫幅廣告 / 149
5.6　用Modernizr提供備選方案 / 153
5.6.1　給頁面添加Modernizr / 154
5.6.2　提供替換樣式 / 155
5.6.3　動(dòng)畫和腳本 / 157
小結(jié) / 163
第6章　使用CSS生成圖標(biāo) / 164
6.1　翻滾吧，圖標(biāo) / 165
6.2　在頁面上使用圖標(biāo) / 165
6.3　何時(shí)使用圖標(biāo) / 167
6.4　生成圖標(biāo)的基礎(chǔ) / 168
6.4.1　內(nèi)容生成圖標(biāo) / 170
6.4.2　CSS Sprite圖 / 170
6.4.3　更“防彈式”的圖標(biāo) / 171
6.4.4　多背景圖片的修飾圖標(biāo) / 172
6.5　Web字體作為圖標(biāo) / 173
6.6　獨(dú)特的純CSS圖標(biāo) / 176
小結(jié) / 179
第7章　CSS3布局排版 / 180
7.1　CSS3布局模塊簡介 / 181
7.2　多欄布局 / 182
7.2.1　設(shè)置分欄的數(shù)量 / 183
7.2.2　根據(jù)寬度分欄而非數(shù)量 / 184
7.2.3　定義分欄空隙 / 185
7.2.4　定義分欄內(nèi)容的填充方式 / 185
7.2.5　內(nèi)容的跨欄目布置 / 187
7.2.6　控制欄目的劃分 / 188
7.2.7　實(shí)戰(zhàn)多欄布局 / 189
7.2.8　多欄布局的問題 / 189
7.3　使用Flexbox / 191
7.3.1　控制Flexbox的子項(xiàng)伸縮流的方向 / 192
7.3.2　自定義子元素的顯示順序 / 195
7.3.3　對(duì)齊Flexbox子項(xiàng) / 195
7.3.4　彈性的Flexbox / 197
7.3.5　用Modernizr實(shí)現(xiàn)跨瀏覽器Flexbox / 201
7.4　探索網(wǎng)格 / 201
7.4.1　定義網(wǎng)格結(jié)構(gòu) / 202
7.4.2　將內(nèi)容嵌套在網(wǎng)格上 / 203
7.4.3　一個(gè)真實(shí)的網(wǎng)格例子 / 204
7.4.4　網(wǎng)格問題 / 205
7.5　值得一提的其他布局模塊 / 206
7.5.1　區(qū)域 / 206
7.5.2　排除 / 208
7.5.3　GCPM / 210
小結(jié) / 211
第8章　響應(yīng)式和自適應(yīng)設(shè)計(jì) / 212
8.1　網(wǎng)絡(luò)瀏覽器簡史 / 213
8.2　響應(yīng)式設(shè)計(jì)策略 / 214
8.2.1　不做任何特殊處理 / 215
8.2.2　不同的設(shè)備提供不同的內(nèi)容 / 215
8.2.3　為不同瀏覽器/設(shè)備優(yōu)化網(wǎng)站 / 218
8.3　彈性布局技術(shù) / 219
8.3.1　可伸縮的容器 / 219
8.3.2　響應(yīng)式媒體布局 / 220
8.4　媒介查詢 / 223
8.4.1　一些媒介查詢的例子 / 225
8.4.2　移動(dòng)設(shè)備優(yōu)先 / 230
8.5　媒介查詢補(bǔ)丁 / 231
8.6　提供響應(yīng)式圖片 / 232
8.7　移動(dòng)瀏覽器是個(gè)騙子 / 233
8.8　高保真設(shè)備 / 237
8.9　一個(gè)響應(yīng)式的重金屬橫幅廣告 / 239
8.9.1　第一種選擇：800px或者更小 / 239
8.9.2　第二種選擇：480px或者更小 / 239
小結(jié) / 241