css - 为什么我通过 -ms-filter 矩阵的偏斜没有在 IE 中应用?

标签 css internet-explorer html skew

我一直在通过 Chrome/Firefox 构建一个站点,现在我在 IE 上查看它,它非常糟糕。我预料到了这一点,但事实证明修复它比我想象的要困难得多。

主要问题是我的网站使用了一些倾斜的元素(它们被用作平行四边形),而这种倾斜并未应用于 IE。这些 div 被指定为“平行四边形”类,因此在我的代码中我编写了:

div.parallelogram { position:absolute; top:0; right:25%; z-index:20; height:100%;
                    width:20%; margin:0;
                    background-color:#000; color:inherit;
                    -moz-transform:skew(-20deg);
                    -o-transform:skew(-20deg);
                    -webkit-transform:skew(-20deg);
                    -ms-filter:"progid:DXImageTransform.Microsoft.Matrix(M11=0.3, M12=1.3,
                      M21=0.7, M22=0, SizingMethod='auto expand')"; }

是的,我遗漏了“filter:”标签,但据我所知,只有 IE7 或更低版本才需要该标签。我想让它至少在一个版本的 IE 上运行,然后我可以考虑其余的!

因此,当我使用 Chrome 查看此代码时,-ms-filter 标记在那里并被划掉了。在 IE 上,它甚至没有出现。我从网上的代码生成器上复制了很多次代码,还是不行!有什么想法吗?

Here's a page有了这个问题。我知道这些链接不起作用,我故意破坏了它们。

更新:多亏了 Teemu,我应用了 -ms-transform,所以我现在可以在 >=IE9 上运行偏斜。我仍然希望至少支持 IE8。

最佳答案

问题是,如果您在测试模式下使用 IE9 或 IE10,则使用“F12”键更改 IE 的呈现版本。 IE 筛选器标记无法检查您的筛选器是否在 IE7 中工作您需要 IE7 的 native 版本,所有其他版本也是如此。

关于css - 为什么我通过 -ms-filter 矩阵的偏斜没有在 IE 中应用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16890236/

相关文章:

css - 使用光滑的半 Angular 覆盖幻灯片

css - 图片链接顶部的链接会破坏图片链接

jquery - 脚本5 : Access is denied IE09 and IE10

javascript - Html5 表单验证不适用于 iphone、android 或 safari

html - 为什么我的媒体屏幕查询不起作用,我不能使我的网站响应?

css - 覆盖默认的 flexbox 子元素为 100% 高度

html - 当我悬停在下拉菜单上时悬停效果消失

excel - MSXML2.XMLHTTP 可以与 Chrome 一起使用吗

javascript - Json 到 csv 转换器(IE 8+)

javascript - Jquery 可点击调整大小动画。最大化 div