CSS 转换不工作 IE
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18969621/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS transform not working IE
提问by CheGueVerra
I have this stylesheet
我有这个样式表
.rotate div img
{
-webkit-transform: translate(-18cm, 2cm) rotate(-90deg); /* WebKit */
-webkit-transform-origin: top right;
-moz-transform: translate(-18cm, 2.5cm) rotate(-90deg);/* Mozilla */
-moz-transform-origin: top right;
-o-transform: rotate(90deg); /* Opera */
-o-transform-origin: top center;
-ms-transform: translate(-18cm) rotate(-90deg); /* Internet Explorer */
-ms-transform-origin: top right;
-sand-transform: translate(-18cm, 2.5cm) rotate(-90deg);
-sand-transform-origin top right;
max-width: 100% !important;
}
I'm having trouble with IE, the transforms are applied and are showing on screen but when I click on the print button, the printed result is without the transforms applied to it.
我在使用 IE 时遇到问题,应用了转换并显示在屏幕上,但是当我单击打印按钮时,打印的结果没有应用转换。
(added screen in the media to see the effects, before printing)
(在媒体中添加屏幕以查看效果,打印前)
It works fine with Firefox and Chrome
它适用于 Firefox 和 Chrome
EDIT
编辑
Yes, I was testing on IE9.
是的,我是在 IE9 上测试的。
Having played with it a bit more yesterday, I noticed that the image did in fact do the transform part, but what is sent to the printer is the image without the transform applied to it.
昨天玩了一点,我注意到图像实际上做了变换部分,但发送到打印机的是没有应用变换的图像。
回答by Mooseman
-ms-transform
does not exist in IE10+. IE8 and older have no support for CSS transforms, IE9 uses only -ms-transform
, and IE10 and newer use only the unprefixed transform
.
-ms-transform
在 IE10+ 中不存在。IE8 及更早版本不支持 CSS 转换,IE9 仅使用-ms-transform
,IE10 及更新版本仅使用不带前缀的transform
.
See http://caniuse.com/#feat=transforms2dfor more info if needed.
如果需要,请参阅http://caniuse.com/#feat=transforms2d了解更多信息。
回答by Sravan
I has same issue but resolved by setting up media attribute to style tag as follows
我有同样的问题,但通过将媒体属性设置为样式标签解决如下
<style type="text/css" media="print">
回答by 3066d0
No need for fancy prefixes, just use normal transform to target MS IE!
不需要花哨的前缀,只需使用普通转换来定位 MS IE!