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

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


!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 星
HTML5与CSS3实现动态网页 2018
  • 参与学习       1887    人
  • 提交作业       4643    份
  • 解答问题       5760    个

有HTML和CSS基础,却不知道如何进阶?本路径带你通过系统学习,完成从“会做网页”到“做出好的动态网页”的蜕变,迈出成为前端工程师的第一步。

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

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