Google的do a barrel roll效果代碼

2024-09-05 12:22:29

字體：大中小

來源：轉載

供稿：網友

google的do a barrel roll效果代碼，分享給大家。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Untitled Document</title><style>     @-moz-keyframes roll { 100% { -moz-transform: rotate(360deg); } }     @-o-keyframes roll { 100% { -o-transform: rotate(360deg); } }     @-webkit-keyframes roll { 100% { -webkit-transform: rotate(360deg); } }     body    {         -moz-animation-name: roll;         -moz-animation-duration: 2s;         -moz-animation-iteration-count: 1;         -o-animation-name: roll;         -o-animation-duration: 2s;         -o-animation-iteration-count: 1;         -webkit-animation-name: roll;         -webkit-animation-duration: 2s;         -webkit-animation-iteration-count: 1;     } </style></head><body><style> <br />@-moz-keyframes roll { 100% { -moz-transform: rotate(360deg); } } <br />@-o-keyframes roll { 100% { -o-transform: rotate(360deg); } } <br />@-webkit-keyframes roll { 100% { -webkit-transform: rotate(360deg); } } <br />body<br />{ <br />-moz-animation-name: roll; <br />-moz-animation-duration: 2s; <br />-moz-animation-iteration-count: 1; <br />-o-animation-name: roll; <br />-o-animation-duration: 2s; <br />-o-animation-iteration-count: 1; <br />-webkit-animation-name: roll; <br />-webkit-animation-duration: 2s; <br />-webkit-animation-iteration-count: 1; <br />} <br /></style></body></html>

上一篇：Js+CSS定義神奇的下劃線

下一篇：懶人上網：使用location定位網頁地址