为什么不是这个元素旋转工作？

我想在IE8中旋转文本。据this答案，也应该可以旋转，试图在下面的例子中的一个因素，如果我检查p元素与开发工具为什么不是这个元素旋转工作？

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
     #enclosing { 
      width: 20px; 
      height: 100px; 
      border: 1px solid; 
     } 

     #rotated { 
      -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=6.123031769111886e-17, M12=1, M21=-1, M22=6.123031769111886e-17, SizingMethod='auto expand')"; 
      width: 100px; 
     } 
    </style> 
</head> 

<body> 
    <div id="enclosing"> 
     <p id="rotated">rotated</p> 
    </div> 
</body> 
</html>

（从this发电机人多势众）

我可以看到它受到某种影响，因为显示所选元素的蓝色边框被正确旋转（但实际元素未被旋转），请参阅下图。

ispected with dev tools

编辑： 为了澄清，这是它的外观没有过滤声明：

without filter statement

来源

2013-05-02 rob

您是否只在前面尝试了'filter：'没有'-ms-'？ – Morpheus 2013-05-02 14:45:30

是的，没有供应商前缀什么也没有发生。（甚至没有显示在图片中的旋转） – rob 2013-05-02 14:48:43

只是来自发生器的一个注释：_/* IE8 + - 必须在一行上，不幸的是*/_您的声明是否在一行中？ – Morpheus 2013-05-02 15:03:04

您当前的标记起作用，问题是您必须在IE10中启用旧式过滤器才能在运行IE8模式的IE10中正确呈现结果。

所以，答案则是使传统的过滤器：http://blogs.msdn.com/b/ie/archive/2012/06/04/legacy-dx-filters-removed-from-ie10-release-preview.aspx

进入“设置[装备]” >>“Internet选项” >>“安全” 然后点击“自定义级别”和道路向下滚动在结果窗口中找到“Render legacy filters”选项。启用它。

Enable legacy filters in IE10

来源

2013-05-02 15:36:37 potench

既然你已经在你正在测试的评论澄清在IE10的IE8 Comaptibility模式下，而不是真正的IE8副本，这变得更容易回答。您的问题的答案是explained here on MSDN

简而言之，IE10认为filter样式已过时并且即使在兼容模式下也会禁用它。可以启用，但只能由最终用户启用。

IE9不受此影响;在IE9中，filter样式工作正常，但对于IE10，您将遇到问题。

引述：

对于Internet Explorer 10，DX过滤器将不能正常工作（已过时）在以下文档模式：

怪癖模式

IE10标准模式

对于其他文档模式，DX过滤器（默认情况下）禁用Internet区域并启用了本地Intra净和可信站点区域。这会影响以下文档模式：

IE9标准模式

IE8标准模式

IE7标准模式

IE5（怪癖）模式

最终用户可以改变这些设置（仅适用于这些文档模式）通过使用Internet选项来更改相关区域的安全设置。管理员也可以使用组策略。

注意出于安全性和性能方面的原因，强烈建议不要这样做。另外，网页无法修改这些设置（通常出于同样的原因）。

这样做的结果是，对于IE10，在兼容模式下不能可靠地使用filter样式。

这意味着：

使用兼容模式来测试你的代码在年长的IE是不是一个很好的测试。您确实需要使用旧IE版本的真实副本才能进行准确的测试。
这是一个坏主意，允许通过用户使用兼容模式来显示你的网站。强制他们使用X-UA-Compatible元标记以IEs最佳呈现模式查看网站。

来源

2013-05-02 15:35:18 Spudley

感谢你为这个描述。我绝对同意你的第一点（特别是在这花了我一天之后）。我不知道第二点是可能的，但我认为这不会是一个大问题。因为除了出于测试目的，谁会以兼容模式运行IE？ – rob 2013-05-02 15:47:58

@rob - 在IE中有配置设置，告诉它在某些情况下默认使用兼容模式。某些公司用户可能已启用这些设置（并且最终用户甚至可能不知道它），这意味着您无法确定*您的网站将呈现给所有用户的模式。您可以使用“X-UA兼容”来覆盖这些设置。 – Spudley 2013-05-02 15:56:17

我没有意识到这一点......添加了 '到我的头:) – rob 2013-05-02 16:06:16

为什么不是这个元素旋转工作？

回答

相关问题