It’s very simple.
- You add an image.
- You create a css property to this image.
<code><span class="pln">img </span><span class="pun">{</span> <span class="kwd">border-radius</span><span class="pun">:</span> <span class="lit">50%</span><span class="pun">;</span> <span class="kwd">-webkit-transition</span><span class="pun">:</span><span class="pln"> -webkit-transform </span><span class="lit">.8s</span><span class="pln"> ease-in-out</span><span class="pun">;</span> <span class="kwd">transition</span><span class="pun">:</span><span class="pln"> transform </span><span class="lit">.8s</span><span class="pln"> ease-in-out</span><span class="pun">;</span> <span class="pun">}</span> <span class="kwd">img</span><span class="pun">:</span><span class="pln">hover </span><span class="pun">{</span> <span class="kwd">-webkit-transform</span><span class="pun">:</span><span class="pln"> rotate</span><span class="pun">(</span><span class="lit">360deg</span><span class="pun">);</span> <span class="kwd">transform</span><span class="pun">:</span><span class="pln"> rotate</span><span class="pun">(</span><span class="lit">360deg</span><span class="pun">);</span> <span class="pun">}</span></code>
<code><span class="tag"><img</span> <span class="atn">src</span><span class="pun">=</span><span class="atv">"http://datainflow.com/xyz.jpg"</span> <span class="tag">/></span></code>
Question and answer is powered by AnsPress.io