每个item为什么都要加两个span啊-慕课网

每个item为什么都要加两个span啊

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

sakurashine

2016-02-23 20:01

<li><a href="#" class="three-d">Videogames
    <span class="three-d-box">
        <span class="front">Videogames</span>
        <span class="back">Videogames</span>
    </span>
</a></li>

加这两个span是为了做谁的样式？
为什么另两个Videogames没有显示出来？

写回答关注

2回答

慕移动9181930

2022-03-23 16:40:35

backgroundColor是明确指出是背景色，background是指背景您好，现在 j s o n 和 x m l 做为通信格式都在使用，要看业务，j s o n 其实很受开发者喜欢，喜欢他比较简单，生成和解析 j s o n 都很方便，但这个要看个人。祝学习愉快！

0 0

sakurashine: 2016-02-23 20:28:34

蠢了233，发完问题就发现了

 .front {
        	transform:rotateX(0deg) translateZ(25px);
        	-ms-transform:rotateX(0deg) translateZ(25px);
        	-o-transform:rotateX(0deg) translateZ(25px);
        	-moz-transform:rotateX(0deg) translateZ(25px);
        	-webkit-transform:rotateX(0deg) translateZ(25px);
         }
        
        .back {
        	transform:rotateX(-90deg) translateZ(25px);
        	-ms-transform:rotateX(-90deg) translateZ(25px);
        	-o-transform:rotateX(-90deg) translateZ(25px);
        	-moz-transform:rotateX(-90deg) translateZ(25px);
        	-webkit-transform:rotateX(-90deg) translateZ(25px);
          color: #FFE7C4;
        }

俩span各在front和back类里做了旋转变换，初始状态下视图与电脑屏幕方向恰好是垂直的，所以状态显示为“看不到”。

2 0

sakura... 回复Hoenir

Z轴变换的不是角度而是距离，单位是px，是做了垂直于眼睛视线方向的移动。比如你手伸直平举起关闭屏幕的手机，慢慢地靠近眼睛，你所看到的东西就会由“整个手机”变为“一片黑”。这里有个demo展示http://www.zhangxinxu.com/study/201209/transform-perspective-translateZ.html详细可以参见这篇博文 http://www.zhangxinxu.com/wordpress/2012/09/css3-3d-transform-perspective-animate-transition/

2016-03-19 20:04:36

共 2 条回复 >

十天精通CSS3

本课程为CSS3入门教程，深刻详解CSS3知识让网页穿上绚丽装备

242554 学习 · 2623 问题

查看课程

相似问题

为什么<span>什么都不写还要加SPAN 呢

回答 4

为什么四个div都要加这个属性啊

回答 3

为什么要span？

回答 1

关于那两个<span>的

回答 4

请问这个+span是什么意思

回答 1

打开慕课网App查看更多内容