3d怎么保存html格式,html – Internet Explorer保存3D修复

以下代码适用于除IE.10之外的所有浏览器.

MSDN网站说以下(我不明白如何申请)：

注意W3C规范为此属性定义了一个关键字值为preserve-3d,表示未执行平坦化.此时,Internet Explorer 10不支持preserve-3d关键字.除了子元素的正常变换之外,您还可以通过手动将父元素的变换应用于每个子元素来解决此问题.

我的代码(我使用CSS选择器的其他原因)：

div[class^="flip"] {

display: inline-block;

}

div[class^="flip"] {

-webkit-perspective: 800;

-moz-perspective: 800;

-ms-perspective: 800;

-o-perspective: 800;

perspective: 800;

width: 313px;

height: 480px;

position: relative;

margin-right: 10px;

margin-left: 10px;

}

div[class^="flip"] .card.flipped {

-webkit-transform: rotatey(-180deg);

-moz-transform: rotatey(-180deg);

-o-transform: rotatey(-180deg);

transform: rotatey(-180deg);

}

div[class^="flip"] .card {

width: 100%;

height: 100%;

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

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

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

transform-style: preserve-3d;

-webkit-transition: 0.5s;

-moz-transition: 0.5s;

-o-transition: 0.5s;

transition: 0.5s;

}

div[class^="flip"] .card .face {

width: 100%;

height: 100%;

position: absolute;

-webkit-backface-visibility: hidden;

-moz-backface-visibility: hidden;

-o-backface-visibility: hidden;

backface-visibility: hidden;

z-index: 2;

text-align: center;

}

div[class^="flip"] .card .front {

position: absolute;

z-index: 1;

background: #F5F5F5;

border: #DDD 1px solid;

}

div[class^="flip"] .card .back {

-webkit-transform: rotatey(-180deg);

-moz-transform: rotatey(-180deg);

-o-transform: rotatey(-180deg);

transform: rotatey(-180deg);

background: #F5F5F5;

border: #DDD 1px solid;

}

Front content

Back content

你能帮我一下吗

非常感谢！