从上面的内容中你会注意到IE8和IE6/7有不同的语法。如果你想支持所有版本的IE,你需要提供两行代码。 可怕的弧度数字如果你想使用45度以外的Angular ,你需要自己计算出这些数字(如果你在网上找的话,有tutorials)。 还要注意,IE6/7语法会导致其他浏览器出现问题,因为过滤器字符串中有未转义的冒号符号,这意味着它是无效的CSS。这会导致Firefox忽略过滤器后的所有CSS代码。这是你需要注意的事情,因为如果你被它抓住,它会导致几个小时的混乱。我解决了这个问题,让IE-其他浏览器未加载的单独样式表中的特定内容。 All other current browsers (including IE9 and IE10 — yay!) support the CSS3 transform style (albeit often with vendor prefixes), so you can use the following code to achieve the same effect in all other browsers:
7条答案
按热度按时间cnjp1d6j1#
要在IE中旋转45度,样式表中需要以下代码:
从上面的内容中你会注意到IE8和IE6/7有不同的语法。如果你想支持所有版本的IE,你需要提供两行代码。
可怕的弧度数字如果你想使用45度以外的Angular ,你需要自己计算出这些数字(如果你在网上找的话,有tutorials)。
还要注意,IE6/7语法会导致其他浏览器出现问题,因为过滤器字符串中有未转义的冒号符号,这意味着它是无效的CSS。这会导致Firefox忽略过滤器后的所有CSS代码。这是你需要注意的事情,因为如果你被它抓住,它会导致几个小时的混乱。我解决了这个问题,让IE-其他浏览器未加载的单独样式表中的特定内容。
All other current browsers (including IE9 and IE10 — yay!) support the CSS3
transform
style (albeit often with vendor prefixes), so you can use the following code to achieve the same effect in all other browsers:编辑
由于这个答案仍然得到了支持票,我觉得我应该更新它与JavaScript库的信息称为CSS砂纸,允许您使用(接近)标准的CSS代码进行旋转,即使在旧的IE版本。
一旦你在你的网站上添加了CSS砂纸,你就可以为IE6 - 8编写下面的CSS代码了:
比您通常需要在IE中使用的传统
filter
样式容易得多。编辑
另外,请注意IE9的另一个特殊之处(仅IE9),它同时支持标准
transform
和旧式IE-ms-filter
。如果同时指定了这两种类型,这会导致IE9完全混乱,并且只呈现一个实心的黑盒子,而元素本来应该在这个黑盒子里。最好的解决方案是通过使用上面提到的砂纸polyfill来避免filter
样式。a1o7rhls2#
您需要执行矩阵变换,如下所示:
其中COS_THETA和SIN_THETA是Angular 的余弦值和正弦值(即45°时为
0.70710678
)。3htmauhk3#
有一个在线工具叫做IETransformsTranslator。用这个工具你可以进行IE6,IE7和IE8上的矩阵过滤转换。只需要粘贴你的CSS3转换函数(例如旋转(15deg)),它就会完成剩下的工作。http://www.useragentman.com/IETransformsTranslator/
h9vpoimq4#
http://css3please.com/
向下滚动到Microsoft IE9+前缀的.“box_rotate”。此处有类似的讨论:Rotating a Div Element in jQuery
v09wglhw5#
提示一下...使用"转换"之前请三思:rotate()",甚至是"-ms-transform:rotate()"(IE9)!
几天来,我一直在拼命地敲墙。我有一个"动态"系统,它能滑动图像,在它上面有一个命令区。我对一个箭头按钮做了"变换",使它模拟上下指向......我已经检查了1000多行代码很久了!!! -)
一切都好,一旦我从CSS中删除了transform:rotate,IE处理它的方式与其他浏览器相比有点(不要用脏话)棘手。
回答得好@Spudley!谢谢你写这篇文章!
4urapxun6#
***Usefull Link***用于IE转换
此工具使用Microsoft专有的Visual Filters技术将CSS3 Transform属性(几乎所有现代浏览器都使用)转换为等效的CSS。
qlvxas9a7#
对于IE11示例(浏览器类型=Trident版本=7.0):