旋转按钮 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>旋转按钮</title>
    <style type="text/css">
        h2{
            padding-left: 15px;
        }
        li {
            float: left;
            margin: 0 10px;
            list-style: none;
        }
        li:hover {
            transform: rotate(360deg) scale(1.2);
        }
    </style>
</head>
<body>
<h2>顺时针旋转360度放大1.2倍</h2>
<ul>
    <li><a href="#"><img src="2/rss.png" /></a></li>
    <li><a href="#"><img src="2/delicious.png" /></a></li>
    <li><a href="#"><img src="2/facebook.png" /></a></li>
    <li><a href="#"><img src="2/twitter.png"/></a></li>
    <li><a href="#"><img src="2/yahoo.png" /></a></li>
</ul>
</body>
</html>
posted @ 2020-09-20 13:14  残冰辉  阅读(239)  评论(0)    收藏  举报