3

我在 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;
}

另请注意，除了过滤器之外，我还有所有浏览器旋转的来源。在这里使用的正确语法是什么？

4

2 回答 2

7

我发现这个 hack 可以为我解决问题。您应该添加过滤器：无；样式到具有黑色背景的容器。不知何故，ie9 不支持用于 ie8 的过滤器样式，因此您必须禁用它。在你的情况下：

.ie9 .view-see-the-difference-in-your-sector .views-field-title span  {
   filter:none;
}

您必须检测您的浏览器是否为 ie9 并将此类添加到某些父节点，例如 body 标记。

于 2013-03-19T11:43:07.707 回答
6

我们正在使用：变换：旋转（45度）；不适用于 Chrome 和 IE9。

第一次尝试：尝试在 IE 中的 CSS 旋转属性中给出的解决方案，它在 IE9 中不起作用。

       i.e:

        -moz-transform: rotate(45deg);  /* FF3.5/3.6 */
        -o-transform: rotate(45deg);  /* Opera 10.5 */
        -webkit-transform: rotate(45deg);  /* Saf3.1+ */
        transform: rotate(45deg);

解决方案：最终解决方案，即：

        -moz-transform: rotate(45deg);  /* FF3.5/3.6 */
        -o-transform: rotate(45deg);  /* Opera 10.5 */
        -webkit-transform: rotate(45deg);  /* Saf3.1+ */
         transform: rotate(45deg);  
         -ms-transform: rotate(45deg); 
          ms-transform: rotate(45deg);  /* This Line did the trick for IE9

Found the solution from following URL : http://bugs.jquery.com/ticket/8346

于 2013-05-28T12:00:39.650 回答