HTML5 CSS3旋转放大特效代码
<style>
.a{
transition:All 0.4s ease-in-out;
-webkit-transition:All 0.4s ease-in-out;
-moz-transition:All 0.4s ease-in-out;
-o-transition:All 0.4s ease-in-out;
width:200px;
height:200px;
background-color:#000000;
display:block;
margin:100px auto;
color:#fff;
text-align:center;
line-height:200px;
font-size:20px;
font-weight:bold;
}
.a:hover {
transform:rotate(360deg) scale(1.2);
-webkit-transform:rotate(360deg) scale(1.2);
-moz-transform:rotate(360deg) scale(1.2);
-o-transform:rotate(360deg) scale(1.2);
-ms-transform:rotate(360deg) scale(1.2);
}
</style>
</head>
<body>
<a class="a">旋转放大</a>
.a{
transition:All 0.4s ease-in-out;
-webkit-transition:All 0.4s ease-in-out;
-moz-transition:All 0.4s ease-in-out;
-o-transition:All 0.4s ease-in-out;
width:200px;
height:200px;
background-color:#000000;
display:block;
margin:100px auto;
color:#fff;
text-align:center;
line-height:200px;
font-size:20px;
font-weight:bold;
}
.a:hover {
transform:rotate(360deg) scale(1.2);
-webkit-transform:rotate(360deg) scale(1.2);
-moz-transform:rotate(360deg) scale(1.2);
-o-transform:rotate(360deg) scale(1.2);
-ms-transform:rotate(360deg) scale(1.2);
}
</style>
</head>
<body>
<a class="a">旋转放大</a>
更多搜索: 本文无需标签!
您阅读这篇文章共花了:
温馨提示:民间偏方秘方仅用于中医爱好者研究学习,未经专业人员指导切勿乱用!
博主简介:少林寺习武3年,中医世家,对玄学有一定的研究。在线人数:33人
需要相关资料请加博主微信
中医玄学交流加微信:hbxt998
赞 6
微信分享提示:①点击右上角的【∶】,②再点击【发送给朋友】或【分享到朋友圈】,让精彩传递!
相关文章
本文作者:静月山人 文章标题: HTML5 CSS3旋转放大特效代码
本文地址:https://www.919941.com/web/186.html 本文已被百度收录
版权声明:若无注明,本文皆为“静月山人博客”原创,转载请保留文章出处。
本文地址:https://www.919941.com/web/186.html 本文已被百度收录
版权声明:若无注明,本文皆为“静月山人博客”原创,转载请保留文章出处。