3D旋转照抄也错 ,哪位大神帮看看哪里错了??-慕课网

3D旋转照抄也错 ,哪位大神帮看看哪里错了??

来源：9-10 制作3D旋转导航综合练习题

五趾的鱼

2017-07-11 10:50

<!DOCTYPE HTML>
<html>
<html>
<head>
<meta charset="UTF-8">
    <title>3D</title>
</head>
<style type="text/css">
  *{
     margin:0px;
padding:0px;
}
.light{
    
    margin-left:200px;
    margin-top:200px;
    width:310px;
    height:100px;
    position:absolute;
perspective:500px;
}

.light .stage{
    
    position:relative;
    width:310px;
    height:100px;
    transform-style:perserve-3d;
    -webkit-transition: all 0.6s;
     }
 
.light .stage .image1{
    width:310px;
height:100px;
background:red;
position:absolute;
-webkit-transform:translateZ(50px);
-webkit-transition: all 0.6s;
}

.light .stage .image2{
    width:310px;
    height:100px;
    background:black;
    position:absolute;
-webkit-transition: all 0.6s;
    -webkit-transform: rotateX(-90deg) translateZ(50px) ;
    
    }
 
.light .stage:hover{
    -webkit-transform: rotateX(90deg);
}
     
 
 
</style>
<body>

<div>
    <div>
   <div>1</div> 
    
   <div>2</div> 

</div>  
 


</div>
















</body>
</html>

写回答关注

1回答

qq_冰蓝色血液_03825539

2017-07-12 14:15:03

body部分？？？
<body>
<div class="light">
<div class="stage">
<div class="image1">1</div>
<div class="image2">2</div>
</div>
</div>
</body>

1 0

五趾的鱼

谢谢找到了是css代码里的一个单词错了

2017-07-12 14:22:42

共 1 条回复 >