CSS3藝術:網頁設計案例實戰

CSS3藝術:網頁設計案例實戰

《CSS3藝術:網頁設計案例實戰》是2020年1月人民郵電出版社出版的圖書,作者是張偶。

基本介紹

  • 中文名:CSS3藝術:網頁設計案例實戰
  • 作者:張偶
  • 出版時間:2020年1月
  • 出版社人民郵電出版社
  • 頁數:316 頁
  • ISBN:9787115518712
  • 定價:89 元
  • 開本:16 開
  • 裝幀平裝
內容簡介,圖書目錄,

內容簡介

本書以 CSS3 版本為平台,使用大量生動、美觀的實例,系統地剖析了 CSS 與視覺效果相關的重要語法。全書分為13章,第1章回顧基礎知識,第2章~第10章介紹了 CSS3 的偽元素,框線,背景, 陰影,剪下、濾鏡和色彩混合,變數與計數器,變換、緩動、動畫等在視覺展現方面的內容,第 11 章~第13 章探討了 CSS3 在造型創意、動畫創意和文字特效創意方面的設計思路。

圖書目錄

第 1 章 CSS 基礎知識
1.1 CSS 簡介
1.2 在頁面中套用CSS
1.2.1 內聯樣式
1.2.2 style 元素
1.2.3 link 標記
1.3 常用CSS 屬性一覽
1.4 選擇器
1.4.2 類選擇器
1.4.4 偽類選擇器
1.5 單位
1.5.1 長度
1.5.2 顏色
1.6 盒模型
1.6.1 內邊距、框線和外邊距
1.6.2 box-sizing
1.7 定位
1.7.1 相對定位
1.7.2 絕對定位
1.8 布局
1.8.1 flex 布局
1.8.2 grid 布局
1.9 重疊
1.9.1 元素之間的重疊關係
1.9.2  含有子元素的容器之間的重疊關係
1.9.3  主元素與子元素(偽元素)之間的重疊關係
1.10 繼承和引用
1.10.1 繼承
1.10.2 引用顏色
1.10.3 引用尺寸
第 2 章 偽元素
2.1 ::before 和::after 偽元素
2.2 content 屬性
2.3 靈活使用偽元素
2.3.1 用偽元素拼接造型
2.3.2 用主元素和偽元素拼接造型
2.3.3 用偽元素表現造型的一部分
2.3.4  用主元素和偽元素表現造型的3 個部分
2.3.5 用偽元素表現成對的元素
2.4 項目套用
2.4.1 項目一:蒸鍋
2.4.2 項目二:怪獸
第3 章 框線
3.1 框線屬性
3.1.1 框線樣式border-style
3.1.2 框線寬度border-width
3.1.3 框線顏色border-color
3.1.4 分別設定每條框線
3.1.5 框線圓角border-radius
3.1.6 輪廓線outline
3.2 描邊造型
3.2.1 同心正方形
3.2.2 同心圓
3.2.3 圓弧
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 項目二:宇宙飛船
第4 章 背景
4.1 背景屬性
4.1.1 背景顏色background-color
4.1.2 背景圖片background-image
4.1.3  背景位置backgroundposition
4.1.4 背景尺寸background-size
4.1.5  背景平鋪backgroundrepeat
4.2 線性漸變linear-gradient()
4.2.1 多個參數值
4.2.2 銳利的線性漸變
4.2.3 線性漸變的角度
4.2.4 有透明度的線性漸變
4.3 徑向漸變radial-gradient()
4.3.1 多個參數值
4.3.2 銳利的徑向漸變
4.3.3 橢圓和正圓
4.3.4 有透明度的徑向漸變
4.4 項目套用
4.4.1 項目一:熊貓
4.4.2 項目二:雷達掃描
第5 章 陰影
5.1 盒陰影box-shadow
5.1.1 外部陰影
5.1.2 內部陰影
5.1.3 多重陰影
5.1.4 複製自身的陰影
5.2 形狀陰影函式drop-shadow()
5.3 項目套用
5.3.1 項目一:日曆
5.3.2 項目二:飛機舷窗
第6 章 剪下、濾鏡和色彩混合
6.1 剪下clip-path
6.1.1 矩形剪下inset()
6.1.2 圓形剪下circle()
6.1.3 橢圓形剪下ellipse()
6.1.4 多邊形剪下polygon()
6.2 濾鏡filter
6.2.1 透明度濾鏡opacity()
6.2.2 模糊濾鏡blur()
6.2.3 色相濾鏡hue-rotate()
6.2.4 亮度濾鏡brightness()
6.2.5 對比度濾鏡contrast()
6.2.6 多重濾鏡
6.3 色彩混合
6.3.1 multiply 模式
6.3.2 screen 模式
6.3.3 difference 模式
6.3.4 color-dodge 模式
6.4 項目套用
6.4.1 項目一:蓮花
6.4.2 項目二:彭羅斯三角形
第7 章 變數與計數器
7.1 變數
7.1.1 聲明和引用變數
7.1.2 表達式
7.1.3 批量描述一組元素的樣式
7.2 計數器
7.2.1 計數器的聲明、累加和讀取
7.2.2 計數器初始值和步長
7.2.3 計數器的序列值
7.2.4 用計數器設計一個字母表
7.3 項目套用
7.3.1 項目一:監控眼
7.3.2 項目二:紙鶴
第8 章 變換
8.1 變換函式
8.1.1 平移函式translate()
8.1.2 旋轉函式rotate()
8.1.3 縮放函式scale()
8.1.4 扭曲函式skew()
8.2 變換原點transform-origin
8.3 多重變換
8.4 項目套用
8.4.1 項目一:炫彩旋臂
8.4.2 項目二:兩隻鸚鵡
第9 章 緩動
9.1 緩動屬性
9.1.1  持續時長transitionduration
9.1.2  延時啟動時長transitiondelay
9.1.3  參與緩動的屬性transitionproperty
9.1.4  時間函式transition-timingfunction
9.2 設定恢復效果
9.3 令一組元素緩動
9.4 對元素的不同狀態進行互動設計
9.4.1 獲得焦點:focus
9.4.2 選擇選項:checked
9.4.3 頁內跳轉:target
9.5 項目套用
9.5.1 項目一:彩虹
9.5.2 項目二:兩顆愛心
第 10 章 動畫
10.1 動畫屬性
10.1.1 語法結構
10.1.2  持續時長animationduration
10.1.3  延時啟動時長animationdelay
10.1.4  時間函式animation-timingfunction
10.1.5  播放次數animation-iterationcount
10.1.6  變化方向animationdirection
10.1.7  填充模式animation-fillmode
10.1.8  播放狀態animation-playstate
10.1.9 多個動畫效果疊加
10.2 關鍵幀@keyframes
10.2.1 from...to... 關鍵幀
10.2.2 百分比關鍵幀
10.2.3 循環效果
10.2.4 靜止效果
10.2.5 關鍵幀的缺點
10.3 不同屬性的動畫效果
10.3.1 框線動畫
10.3.2 背景動畫
10.3.3 陰影動畫
10.3.4 剪下動畫
10.3.5 變換動畫
10.4 項目套用
10.4.1 項目一:桌球對打
10.4.2  項目二:徘徊的果凍怪獸
第 11 章 CSS 造型創意
11.1 螺旋形狀的盤式蚊香
11.2 倒圓錐形狀的熱氣球
11.3 逼真金屬質感的筆記本電腦
11.4 用典型特徵塑造的卓別林形象
第 12 章 CSS 動畫創意
12.1 層疊起伏的海浪
12.2 天體運轉模型
12.3  充滿秩序美的佇列變色旋轉動畫
12.4  幾何光學引起的咖啡館牆壁錯覺動畫
第 13 章 文字特效創意
13.1 撕紙文字
13.2 牛奶文字
13.3 閃光的霓虹文字
13.4 立體的階梯文字
附錄 CSS 色彩名稱對照表

相關詞條

熱門詞條

聯絡我們