《深入理解SVG》介紹SVG繪畫,包括基礎(chǔ)知識(shí)和如何通過混合和搭配工具來生成復(fù)雜的效果。主要內(nèi)容包括:把SVG代碼轉(zhuǎn)換為可視圖形的渲染模型,如何使用顏色,透明度的控制方法以及它對(duì)圖片的影響,渲染服務(wù)和漸變。
《深入理解SVG》適合所有想利用SVG提高Web體驗(yàn)的讀者.
作為W3C的開放標(biāo)準(zhǔn),SVG被越來越多的開發(fā)者所關(guān)注。SVG不只是簡單的矢量圖,還可以加上更復(fù)雜的繪畫和更細(xì)致的效果,包括渲染、漸變、應(yīng)用到文本,甚至可以添加照片。
本書深入介紹SVG繪畫。主要內(nèi)容如下。
-SVG渲染模型如何實(shí)現(xiàn)描邊和填充
-標(biāo)準(zhǔn)顏色的應(yīng)用,自定義顏色,創(chuàng)建顏色模板
-透明度的設(shè)置
-如何控制線性漸變?cè)谝秩镜男螤顑?nèi)移動(dòng)
-重復(fù)線性漸變
-磁貼、紋理和圖片圖案
-如何在文本上應(yīng)用渲染服務(wù)
-給渲染服務(wù)添加動(dòng)畫
Amelia Bellamy-Royds,W3C SVG工作組特邀專家,積極參與SVG輔助工作組的工作,并通過Web Platform Docs等在線社區(qū)來幫助促進(jìn)Web標(biāo)準(zhǔn)和設(shè)計(jì)的發(fā)展。
Kurt Cagle,SVG工作組成員,目前是W3C Xforms工作組特邀專家,美國國會(huì)圖書館XML數(shù)據(jù)架構(gòu)師。
劉濤,網(wǎng)絡(luò)常用名“武官尚書”,前端開發(fā)工程師,目前就職于奇虎360搜索團(tuán)隊(duì),曾在多個(gè)平臺(tái)翻譯、原創(chuàng)前端相關(guān)文章。熱愛前端,熱愛翻譯,關(guān)注前端技術(shù)的發(fā)展變遷,熱衷于新技術(shù)的學(xué)習(xí)研究。
第1 章 你應(yīng)該知道的事 1
1.1 SVG 通過代碼來畫圖 1
1.2 SVG 始終是開源的 2
1.3 SVG 是XML(有時(shí)也是HTML) 2
1.4 SVG 是可壓縮的 2
1.5 圖片是形狀的集合 3
1.6 圖片中可以包含圖片 3
1.7 文本也是藝術(shù) 3
1.8 藝術(shù)源于數(shù)學(xué) 3
1.9 SVG 是無數(shù)canvas 的有限集 3
1.10 SVG 是有結(jié)構(gòu)的 4
1.11 SVG 是有樣式的 4
1.12 所有好用的標(biāo)記都基于偉大的DOM 4
1.13 SVG 是可移動(dòng)的 5
1.14 SVG 在發(fā)展變化 5
第2 章 畫家模型 6
2.1 使用fill 屬性進(jìn)行填充 7
2.2 使用stroke 屬性描邊 10
2.3 層疊描邊和填充 15
2.4 使用渲染提示屬性 22
第3 章 創(chuàng)建顏色 26
3.1 使用名稱生成朦朧玫瑰紅 26
3.2 彩虹三原色 31
3.3 自定義顏色 34
3.4 混合和搭配 41
第4 章 透明 44
4.1 穿透樣式 44
4.2 其他效果 49
第5 章 渲染服務(wù) 52
5.1 渲染和壁紙 52
5.2 標(biāo)識(shí)資源 53
5.3 純色漸變 56
第6 章 簡單的漸變 61
6.1 逐步漸變 61
6.2 透明漸變 64
6.3 控制顏色變換 65
第7 章 各種形狀和尺寸的漸變 70
7.1 漸變矢量 70
7.2 對(duì)象邊界盒 74
7.3 在盒子表面繪制 78
7.4 漸變,變換 83
第8 章 重復(fù) 92
8.1 如何擴(kuò)展?jié)u變 92
8.2 無窮漸變映射 94
8.3 非映射重復(fù) 95
8.4 在HTML 中使用(復(fù)用)漸變 98
第9 章 徑向漸變 111
9.1 徑向漸變基礎(chǔ) 111
9.2 填充盒子 113
9.3 縮放圓 117
9.4 調(diào)整焦點(diǎn) 120
9.5 變換徑向漸變 123
9.6 大型漸變 124
第10 章 磁貼與紋理 136
10.1 搭積木 137
10.2 適當(dāng)拉伸 143
10.3 布局磁貼 146
10.4 變換磁貼 151
第11 章 完美的圖片圖案 158
11.1 層次感 158
11.2 保持原始圖案 162
11.3 SVG 樣式的背景圖片 165
第12 章 有紋理的文本 173
12.1 邊界文本 174
12.2 中途切換樣式 179
第13 章 繪制線條 184
13.1 超出邊緣的部分 184
13.2 空盒子 186
13.3 使用坐標(biāo)空間 192
13.4 有圖案的線條 196
第14 章 動(dòng)畫 198
14.1 動(dòng)畫選項(xiàng) 198
14.2 坐標(biāo)動(dòng)畫 204
14.3 交互動(dòng)畫 208
附錄A 顏色關(guān)鍵詞和語法 223
附錄B 元素,元素屬性,樣式屬性 229
作者介紹 236
封面介紹 236