問題描述
我正在尋找在 IE8 中旋轉元素的 CSS 解決方案.我發現的一些解決方案說它應該在 IE8 中工作,但它不適合我.我做錯了什么?
I'm looking for CSS solution for rotating elements in IE8. Some of solutions I've found say that it should work in IE8, but it does not for me. What I do wrong?
這是我嘗試過的:
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
.rotate {
font-weight: bold;color: #000;background: #aa0;display: block;margin: 0 auto;width: 300px;height: 300px;top: 10%;text-align: center;line-height: 300px;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
</style>
</head>
<body>
<div class="rotate">
TESTING ROTATION
</div>
</body>
</html>
如果您在回答之前測試您的解決方案,我將不勝感激,如果您可以編輯我給定的示例并重新發布所有代碼,那就太好了.
I would appreciate if you test your solution before answering, and it would be great ir you could just edit my given example and repost all code.
如果有人仍然好奇,問題不是代碼,而是測試環境.您應該使用真正的 IE8,而不是 IE10/IE11 中的 IE8 模擬器(不確定 IE9)
If anyone is still curious the problem is not the code, but the testing environment. You should use real IE8, but not IE8 emulator in IE10/IE11 (not sure about IE9)
推薦答案
你缺少IE供應商前綴-ms-
You are missing IE vendor prefix -ms-
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
所以,使用這個
-ms-filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); /* for IE8 */
也看看這個問題:CSS 在 IE 中旋轉屬性可能對你有幫助
Also look at this question: CSS rotate property in IE that might help you
這篇關于IE8 CSS 旋轉的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網!