CSS实现三角形的动画旋转

        我们在Web前端开发的时候，为了实现页面的精致效果，都会把每一个细节都处理的无可挑剔，那么今天，我就总结一下在菜单栏中经常用到的会动画旋转的三角形的用法。

<div id="Arrow"></div>

        首先，我们应该先通过css设计出一个三角形。

/* 三角形 */
#Arrow{
    width:0px;
    height:0px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top:5px solid #fff; 
    float:left; 
}

</style>

        接下来，对该三角形添加   transition属性，该属性是指：在一定的时间内平滑地过渡，因为考虑到不同的浏览器，所以修改后的css代码如下：