div 旋转

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>css3 通过transform属性实现DIV元素的旋转</title>

<style>

.aimateStyle{

 border:1px solid black;

 width:300px;

 height:300px;

 background:#abcdef;

 position:absolute;

 top:150px;

 left:200px;

}

#aixuexi{

border:1px solid black;

  width:200px;

  height:150px;

  background:#f9c;

-moz-transform:rotate(45deg);

-webkit-transform:rotate(45deg);

-o-transform:rotate(45deg);  

-ms-transform:rotate(45deg); 

transform:rotate(45deg); 

}

</style>

</head>

<body>

<div class="aimateStyle">

<div id="aixuexi">

 animations 动画效果

</div>

</div>

</body>

</html>

posted on 2016-10-22 14:40  山冈龙  阅读(172)  评论(0编辑  收藏  举报

导航