文字流光漸變
background-image:使用css3的漸變繪製影象，從左到右
background-image: -webkit-linear-gradient(left, #3498db, #f47920 10%, #d71345 20%, #f7acbc 30%, #ffd400 40%, #3498db 50%, #f47920 60%, #d71345 70%, #f7acbc 80%, #ffd400 90%, #3498db);
-webkit-background-clip：裁剪背景影象,使用文字作為裁剪區域向外裁剪，此時文字顏色仍覆蓋背景圖
-webkit-background-clip: text;
-webkit-text-fill-color：設定字型顏色。將字型顏色設定成透明，這樣就能將背景圖顯示出來了
-webkit-text-fill-color: transparent;
background-size：背景圖長度。背景圖寬度拉長至兩倍另外超出的半截顏色組用來實現流光效果
background-size: 200% 100%
animation：動畫。
@keyframes streamer
100%
}背景模糊
filter：影象設定高斯模糊。filter: blur(10px);
transition：動畫時間（transition: property duration timing-function delay;）
滑鼠移入移出都要效果就都加這個屬性。
transition: all 2s;
邊框兩邊伸展
用偽元素::before，::after來實現。
兩邊散開：開始設定相對父容器的50%，在hover的時候，分別吧對應的left 和top值變為0。
section
.con
::before
section
:hover
.con
::before
CSS3實現文字流光漸變特效
先上個效果圖 下面先上 html部分 日暮蒼山遠，天寒白屋貧。柴門聞犬吠，風雪夜歸人。css部分 其實這是乙個挺簡單的小例子，屬性的作用在這裡就不多說，因為文件都能查的到，我在這裡主要說一說思路。1 linear gradient屬性給文字加乙個線性漸變的背景色 2 transparent 將文字設...
css3文字顏色動態漸變
瀏覽 animate.css官網 的時候發現animate.css這幾個字母的顏色會慢慢變化，個人覺得還是很有意思，本以為是利用animate改變color,結果f12後發現好多奇怪的css屬性。先來看看我的實現方法 h2 webkit keyframes hue to 通過通過css3的動畫屬性可...
Css3 文字漸變整理（一）
一 文字顏色漸變 可以應用在所有接受影象的屬性上，允許使用簡單的語法實現顏色漸變，以便ua在渲染頁面自動生成影象。語法 linear gradient repeating linear gradient radial gradient repeating radial gradient 注意 必需在...