css3 漸變（gradients）可以讓你在兩個或多個指定的顏色之間顯示平穩的過渡。
線性漸變（linear gradients）- 向下/向上/向左/向右/對角方向
徑向漸變（radial-gradient）- 它們中心定義
設定形狀-
shape -----circle 表示圓形，ellipse 表示橢圓形 預設值是 ellipse
新增效果css屬性
效果持續時間
transition預設值是0。
過渡屬性
transition
簡寫屬性，用於在乙個屬性中設定四個過渡屬性。
transition-property
規定應用過渡的 css 屬性的名稱。
transition-duration
定義過渡效果花費的時間。預設是 0。
transition-timing-function
規定過渡效果的時間曲線。預設是 "ease"。勻速linear
transition-delay
規定過渡效果何時開始。預設是 0。
transform-origin: right top 設定旋轉軸心
2d轉化：
translate() 平移
rotate() 旋轉
scale() ：scale()方法，該元素增加或減少的大小，取決於寬度（x軸）和高度（y軸）的引數：
skew()：包含兩個引數值，分別表示x軸和y軸傾斜的角度，如果第二個引數為空，則預設為0，引數為負表示向相反方向傾斜。
matrix()方法和2d變換方法合併成乙個。
matrix 方法有六個引數，包含旋轉，縮放，移動（平移）和傾斜功能
3d轉化
函式 描述
matrix3d(n,n,n,n,n,n,
n,n,n,n,n,n,n,n,n,n)16 個值的 4x4 矩陣。
translate3d(x,y,z) 3d 轉化。
translatex(x) x 軸的值。
translatey(y) y 軸的值。
translatez(z) z 軸的值。
scale3d(x,y,z) 縮放轉換。
scalex(x) x 軸的值。
scaley(y) y 軸的值。
scalez(z) z 軸的值。
rotate3d 旋轉
rotatex-- x 軸旋轉
rotatey-- y軸旋轉
rotatez- z軸旋轉
perspective(n)-定義 3d 轉換元素的透視檢視
@keyframes -規定動畫
animation- 所有動畫屬性的簡寫屬性
animation-name- @keyframes 動畫的名稱
animation-duration -動畫完成乙個週期花費的秒或毫秒
animation-timing-function -動畫的速度曲線
animation-delay- 動畫何時開始
animation-play-state -動畫是否正在執行或暫停
動畫設定所有的屬性：
6.css3多列布局
css3 可以將文字內容設計成像報紙一樣的多列布局
css3 多列屬性
column-count-元素應該被分割的列數。
column-fill-如何填充列
column-gap-列與列之間的間隙
column-rule-* 屬性的簡寫
column-rule-color-兩列間邊框的顏色
column-rule-style-兩列間邊框的樣式
column-rule-width-兩列間邊框的厚度
column-span-元素要跨越多少列
column-width-列的寬度，不要與column-count同時使用
css 漸變 過渡
day19 1 瀏覽器css3屬性字首 很多css3屬性，最初的預覽版沒有形成最終的正式版，但是瀏覽器為了對這些新屬性形成支援，主流瀏覽器都提供了屬於自己的語法規則 瀏覽器字首 webkit 谷歌 蘋果 瀏覽器字首 moz 火狐瀏覽器字首 ms ie瀏覽器字首 o 歐鵬瀏覽器字首 注 新增瀏覽器字首...
CSS3漸變 過渡 轉換 動畫
2 css3漸變的分類 線性漸變 lineargradients 向下 向上 向左 向右 對角方向 徑向漸變 radial gradient 由它們的中心定義 3 css3線性漸變 為了建立乙個線性漸變，你必須至少定義兩種顏色結點。顏色結點即你想要呈 現平穩過渡的顏色。同時，你也可以設定乙個起點和乙...
css旋轉45度 css 漸變過渡2D
一 過渡屬性 transition css3的transition允許css的屬性值在一定的時間區間內平滑地過渡。這種效果可以在滑鼠劃過 單擊 獲得焦點或對元素任何改變中觸發，並圓滑地以動畫效果改變css的屬性值 過渡屬性需要觸發事件，如 hover 滑鼠劃過事件 1.transition prop...