我在 IE9 中使用以下内容:
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
它以旋转文本的方式工作,但奇怪的是它无缘无故地为元素提供了黑色背景?!
CSS:
.view-see-the-difference-in-your-sector .views-field-title span {
display: block;
-moz-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
-ms-transform:rotate(-90deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
zoom: 1;
-moz-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
-o-transform-origin: 0 0;
-ms-transform-origin: 0 0;
width: 200px;
}
另请注意,除了过滤器之外,我还有一个所有浏览器旋转的原点。 此处使用的正确语法是什么?
最佳答案
我发现这个 hack 可以为我解决问题。你应该添加 filter:none;样式到具有黑色背景的容器。不知何故 ie9 不支持用于 ie8 的过滤器样式,因此您必须禁用它。在你的情况下:
.ie9 .view-see-the-difference-in-your-sector .views-field-title span {
filter:none;
}
您必须检测您的浏览器是否为 ie9 并将此类添加到某些父节点,如 body 标签。
关于CSS3 旋转导致问题 IE9,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11957008/