创造精美折纸爱心盒子视频盒子步骤

来源：蜘蛛抓取(WebSpider) 时间：2016-04-26 10:53 标签： 精美折纸爱心盒子
您的位置：
创造世界盒子传奇
创造世界盒子传奇v1.0.0
有人说，战争是历史演变的强力催化剂，诚然，人类短短的几千年文明史中，爆发了无数大大小小的战争，然而今天我们的主题却不是对战争高谈阔论，今天小编要为小伙伴带来的是…
近年来像素风游戏如同雨后春笋般强势来袭，越来越多的精致的像素大小游戏纷纷降临安卓手游市场，相信也为众多的像素游戏爱好者们带来了福音，今天天就来和小编一起看看安卓…
创造世界盒子传奇v1.0.0
本站仅创建用户沟通交流的平台，所展示的安卓软件资源内容来自于第三方上传分享，版权问题均与我站无关。资源仅作为用户间分享讨论之用，除开发商授权外不以盈利为目的。如该游戏触犯了您的权利，请申诉！邮箱：
87385人推荐
13069人推荐
10205人推荐
7354人推荐
7250人推荐
6073人推荐
6007人推荐
5091人推荐
4741人推荐
4322人推荐
CopyRight2004年-年
游迅网 All Rights Reserved
备案编号:沪ICP备号-9【CSS3练习】3D盒子制作 - 推酷
【CSS3练习】3D盒子制作
先发个3D盒子最终效果图
制作步骤1：创建基本结构
分布把6个面定义到3&3的画布上，1和4暂且是重叠的。
html结构比较简单：
&div class=&box& id=&box&&
&div class=&layer&&1&/div&
&div class=&layer&&2&/div&
&div class=&layer&&3&/div&
&div class=&layer&&4&/div&
&div class=&layer&&5&/div&
&div class=&layer&&6&/div&
*{margin:0;padding:0;}
.box{margin:50width: 300height: 300 border:1px solid #position:}
.layer{background-color: #000;width: 100height: 100position:color: #line-height: 100font-size: 50text-align:}
.layer:nth-of-type(1){top:100left:100opacity: 0.2;}
.layer:nth-of-type(2){top:0left:100opacity: 0.4;}
.layer:nth-of-type(3){top:200left:100opacity: 0.6;}
.layer:nth-of-type(4){top:100left:100opacity: 0.8;}
.layer:nth-of-type(5){top:100left:0;opacity: 0.4;}
.layer:nth-of-type(6){top:100left:200opacity: 0.4;}
制作步骤2：把6个面3d旋转到对应的位置上
首先box需要设置一个{perspective: 200}大概的意思是告诉浏览器我要进行3d视图了。
然后给每个layer进行3d旋转，并且根据对于的位置设置transform-origin，大概意思就是在什么位置进行旋转。
旋转一个面(2)：css添加：transform:rotateX(-90deg);transform-origin: 根据元素的底部旋转x：-90
旋转一个面(3)：css添加：transform:rotateX(90deg);transform-origin:
旋转一个面(5)：css添加：transform:rotateY(90deg);transform-origin:
旋转一个面(6)：css添加：transform:rotateY(-90deg);transform-origin:
最后把盒子封上(4)：css添加：background-color:transform:translateZ(100px); 4跟1的位置是一样的，只需要进行3d Z到100px
制作步骤3：让盒子旋转起来
想让盒子3d旋转还需要给box加个css属性&transform-style:preserve-3d 是一个3d透视的声明
然后在设置不同的旋转角度就可以玩了transform: rotateX(-25deg)
已发表评论数()
已收藏到推刊！
请填写推刊名
描述不能大于100个字符!
权限设置： 公开
仅自己可见
正文不准确
标题不准确
排版有问题
没有分页内容
图片无法显示
视频无法显示
与原文不一致UE4教程 创建天空盒子_土豆_高清视频在线观看

我要回帖

更多关于 精美折纸爱心盒子 的文章

 

随机推荐