css3鼠标悬停按钮滑动切换动画

1、新建html文档。

3、书写hmtl代艨位雅剖码。<div class="container_even"&爿讥旌护gt; <div class="set_container"> <div class="set_2_button color1 set_2_btn-1 icon-forward"><span>Sample Button</span></div> <!--End of Button 1 --> <div class="set_2_button color2 set_2_btn-1 icon-backward"><span>Sample Button</span></div> <!--End of Button 2 --> <div class="set_2_button color3 set_2_btn-2 icon-up"><span>Sample Button</span></div> <!--End of Button 3 --> <div class="set_2_button color4 set_2_btn-2 icon-down"><span>Sample Button</span></div> <!--End of Button 4 --> <div class="set_2_button color5 set_2_btn-2 icon-down"><span>Sample Button</span></div> <!--End of Button 5 --> <div style="clear:both"></div> </div> </div>

5、代码整体结构。