CSS3功能在IE中不起作用，尽管增加了-ms-

这是我添加到我的网站的CSS。它在Firefox和Chrome工作，但不工作在Internet Explorer。 W3C说这些CSS功能应该在IE中正确处理。 IE可以处理transform-origin and transform-style但不在这里。CSS3功能在IE中不起作用，尽管增加了-ms-

a 
{ 
color: #03c; 
display: inline-block; 
overflow: hidden; 
vertical-align: top; 
-webkit-perspective: 600px; 
-moz-perspective: 600px; 
-o-perspective: 600px; 
-ms-perspective: 600px; 
perspective: 600px; 
-webkit-perspective-origin: 50% 50%; 
-moz-perspective-origin: 50% 50%; 
-o-perspective-origin: 50% 50%; 
-ms-perspective-origin: 50% 50%; 
perspective-origin: 50% 50%;} 

a span 
{ 
display: block; 
position: relative; 
padding: 0 2px; 
-webkit-transition: all 400ms ease; 
-moz-transition: all 400ms ease; 
-o-transition: all 400ms ease; 
-ms-transition: all 400ms ease; 
transition: all 400ms ease; 
-webkit-transform-origin: 50% 0%; 
-moz-transform-origin: 50% 0%; 
-o-transform-origin: 50% 0%; 
-ms-transform-origin: 50% 0%; 
transform-origin: 50% 0%; 
-webkit-transform-style: preserve-3d; 
-moz-transform-style: preserve-3d; 
-o-transform-style: preserve-3d; 
-ms-transform-style: preserve-3d; 
transform-style: preserve-3d;} 

a:hover span 
{ 
background: #03c; 
-webkit-transform: translate3d(0px, 0px, -30px) rotateX(90deg); 
-moz-transform: translate3d(0px, 0px, -30px) rotateX(90deg); 
-o-transform: translate3d(0px, 0px, -30px) rotateX(90deg); 
-ms-transform: translate3d(0px, 0px, -30px) rotateX(90deg); 
transform: translate3d(0px, 0px, -30px) rotateX(90deg); 
} 

a span:after { 
content: attr(data-title); 
display: block; 
position: absolute; 
left: 0; 
top: 0; 
padding: 0 2px; 
color: #fff; 
background: #03c; 
-webkit-transform-origin: 50% 0%; 
-moz-transform-origin: 50% 0%; 
-o-transform-origin: 50% 0%; 
-ms-transform-origin: 50% 0%; 
transform-origin: 50% 0%; 
-webkit-transform: translate3d(0px, 105%, 0px) rotateX(-90deg); 
-moz-transform: translate3d(0px, 105%, 0px) rotateX(-90deg); 
-o-transform: translate3d(0px, 105%, 0px) rotateX(-90deg); 
-ms-transform: translate3d(0px, 105%, 0px) rotateX(-90deg); 
transform: translate3d(0px, 105%, 0px) rotateX(-90deg); 
}

来源

2014-05-09 Conspiria

什么版本的ie？ –

“W3C表示这些CSS功能应该在IE中正确处理。”真？它在哪里说呢？另外，浏览器并不会奇迹般地通过向它添加适当的前缀来支持某些东西。 – BoltClock

IE 11.最新版本。你输入了transform-origin和transform-style，看看W3C关于支持的浏览器的说法 – Conspiria

看看Internet Explorer 9的使用供应商前缀-ms-，虽然- ms-已在Internet Explorer 10及更高版本中弃用。

来源

2014-05-09 08:36:57 BenEgan1991

ms-transform-origin在IE 9，transform-origin在IE10被支撑。低版本根本不支持它。

也看看IE Dev Center

编辑：

也许在this question上SO

来源

2014-05-09 08:33:01 janatuerlich

我使用的是IE 11.0.7，所以它必须支持它，但是你自己试一下，那在那种情况下不起作用 – Conspiria

CSS3功能在IE中不起作用，尽管增加了-ms-

回答

相关问题