<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>应用transition-property属性实现过度</title>
<style type="text/css">
.preview
{
background:url(images/style0.gif) no-repeat;
position:absolute;
top:0px;
left:0px;
width:240px;
height:210px;
border:1px #000000 dashed;}
#xy
{
background:url(images/style0.gif) no-repeat;
-moz-transition-duration:1.5s,1.5s;
-webkit-transition-duration:1.5s,1.5s;
-o-transition-duration:1.5s;
-ms-transition-duration:1.5s;
top:0px;
left:100px;
border:1px #000000 dashed;}
#xy:hover
{
-moz-transform:rotate(30deg);
-webkit-transform:rotate(30deg);
-o-transform:rotate(30deg);
position:absolute;
}
</style>
</head>
<body>
<div id="wall"></div>
<div class="preview">
</div>
<div class="preview" id="xy">
</div>
</body>
</html>
33、实例 应用transition-property属性实现过度
最新推荐文章于 2022-07-21 19:19:31 发布