A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© cyberpunkjill 初级黑马   /  2019-9-25 22:11  /  843 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

body {
            perspective: 2000px;
        }
        
        section {
            position: relative;
            width: 300px;
            height: 200px;
            margin: 100px auto;
            transform-style: preserve-3d;
            animation: zhuan .0001s linear infinite;
        }
        
        @keyframes zhuan {
            0% {}
            100% {
                transform: rotateY(360deg);
            }
        }
        
        section div {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: url(img/dog.jpg) no-repeat;
        }
        
        section div:first-child {
            transform: translateZ(300px);
        }
        
        section div:nth-child(2) {
            transform: rotateY(60deg) translateZ(300px);
        }
        
        section div:nth-child(3) {
            transform: rotateY(120deg) translateZ(300px);
        }
        
        section div:nth-child(4) {
            transform: rotateY(180deg) translateZ(300px);
        }
        
        section div:nth-child(5) {
            transform: rotateY(240deg) translateZ(300px);
        }
        
        section div:nth-child(6) {
            transform: rotateY(300deg) translateZ(300px);
        }

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马