標籤:doc anim and from blog nbsp block letter char
不回頭看,去過自己另外的生活。
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>CSS3-閃光-效果</title><style> .element{ color: #f35626; background-image: -webkit-linear-gradient(92deg,#f35626,#feab3a); -webkit-background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: hue 60s infinite linear; margin-bottom: 1.5rem; font-size: 3rem; font-weight: 100; line-height: 1; letter-spacing: -.05em; } .animated { -webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }@-webkit-keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }}@keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }}.pulse { -webkit-animation-name: pulse; animation-name: pulse;}</style></head><body> <div class="element animated pulse">pulse</div></body></html>View Code
CSS3 脈衝效果