当您悬停在红色方形上时，它在x轴上旋转180°，即使背面可见度设置为隐藏，也会显示背面，至少直到达到180°，然后消失。删除透视属性，你会看到它的工作原理，背面是不可见的，但所有的3d效果失去了。
可以通过在transform属性中应用透视来解决这个问题：http://jsfiddle.net/M2pyb但是这将导致与transform-origin-z相关的问题，当z设置为0以外的任何值时，整个事情变为“scaled”：http://jsfiddle.net/s4ndv不幸的是这不是一个解决方案。
背面可见的东西是probaly一个错误？如果是这样，除了我提到的之外，有没有什么工作？
解决方法
解决方法是对子元素应用透视变换。我在这里更新你的小提琴：http://jsfiddle.net/jMe2c/
.item {
backface-visibility: hidden;
transform: perspective(200px) rotateX(0deg);
}
.container:hover .item {
transform: perspective(200px) rotateX(180deg);
}
(参见http://stackoverflow.com/a/14507332/2105930的答案)
我认为这是因为在IE 10中，父元素3d属性不会传播到子元素。这是已知的不支持的功能。退房http://msdn.microsoft.com/en-us/library/ie/hh673529%28v=vs.85%29.aspx#the_ms_transform_style_property：
At this time,Internet Explorer 10 does not support the preserve-3d keyword. You can work around this by manually applying the parent element’s transform to each of the child elements in addition to the child element’s normal transform.
