为什么我的都实现不了呢?

为什么我的都实现不了呢?


!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<style type="text/css">

*{

margin:0;

padding: 0;

}

body{

background:#abcdef;

}

div{

position: relative;

width:800px;

height:800px;

margin:auto;

-webkit-transform-style:preserve-3d;

-moz-transform-style:preserve-3d;

-ms-transform-style:preserve-3d;

-o-transform-style:preserve-3d;

transform-style:preserve-3d;

-webkit-perspective: 500px;

-moz-perspective: 500px;

-ms-perspective:500px;

-o-perspective:500px;

perspective:500px;

-webkit-perspective-origin:top;

-moz-perspective-origin:top;

-ms-perspective-origin:top;

-moz-perspective-origin:top;

perspective-origin:top;


}

div.one,div.two,div.three,div.four{

position:absolute;

top:0;

right:0;

bottom:0;

left:0;

margin:auto;

}

.one{

background: url(1.png) no-repeat center center;

transform:rotateY(-45deg);

}

.two{

background: url(2.png) no-repeat center center;

transform:rotateX(-45deg);

}

.three{

background: url(3.png) no-repeat center center;

transform:rotateZ(-45deg);

}

.four{

background: url(4.png) no-repeat center center;

}

</style>

</head>

<body>

<div class="one"></div>

<div class="two"></div>

<div class="three"></div>

<div class="four"></div>

</body>

</html>


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
怎么都被占用了呢 2017-11-09 15:43:01

经测试你的代码,效果是实现了呢,你没有实现具体是个什么情况呢

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师