特定のアイコンを回転させたいな。CSS で。

Postscripts

• dizzyfunny

  Posted on 5 years ago

  いけた。

  /* Icon Rotaion */ @-webkit-keyframes rotating /* Safari and Chrome */ { from { -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes rotating { from { -ms-transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } to { -ms-transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } .term-icon .icon-dizzy, .term-icon .icon-emoticon-lol-outline { -webkit-animation: rotating 3s linear infinite; -moz-animation: rotating 3s linear infinite; -ms-animation: rotating 3s linear infinite; -o-animation: rotating 3s linear infinite; animation: rotating 3s linear infinite; }

  1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40

  /* Icon Rotaion */ @-webkit-keyframes rotating /* Safari and Chrome */ {   from {     -webkit-transform: rotate(0deg);     -o-transform: rotate(0deg);     transform: rotate(0deg);   }   to {     -webkit-transform: rotate(360deg);     -o-transform: rotate(360deg);     transform: rotate(360deg);   } } @keyframes rotating {   from {     -ms-transform: rotate(0deg);     -moz-transform: rotate(0deg);     -webkit-transform: rotate(0deg);     -o-transform: rotate(0deg);     transform: rotate(0deg);   }   to {     -ms-transform: rotate(360deg);     -moz-transform: rotate(360deg);     -webkit-transform: rotate(360deg);     -o-transform: rotate(360deg);     transform: rotate(360deg);   } } .term-icon .icon-dizzy, .term-icon .icon-emoticon-lol-outline {   -webkit-animation: rotating 3s linear infinite;   -moz-animation: rotating 3s linear infinite;   -ms-animation: rotating 3s linear infinite;   -o-animation: rotating 3s linear infinite;   animation: rotating 3s linear infinite; }

  参考: https://stackoverflow.com/questions/6410730/css-endless-rotation-animation

  Add a Postscript