77

私が行ったデザインで垂直にする必要がある要素があります。これが IE9 以外のすべてのブラウザで動作するように CSS を取得しました。IE7 と IE8 のフィルターを使用しました。

progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

ただし、これは私の要素を IE9 で透明にレンダリングするようで、CSS3 の「変換」プロパティは何もしないようです!

とにかくIE9で要素を回転させることを知っている人はいますか?

助けてくれて本当にありがとう！

W.

4

5 に答える 5

139

標準の CSS3 ローテーションは IE9 で動作するはずですが、次のようにベンダー プレフィックスを付ける必要があると思います。

  -ms-transform: rotate(10deg);

ベータ版では動作しない可能性があります。そうでない場合は、現在のプレビュー バージョン (プレビュー 7) をダウンロードしてみてください。これは、ベータ版より後のリビジョンです。テストするベータ版を持っていないので、そのバージョンにあったかどうかは確認できません。最終リリース バージョンでは、確実にサポートされる予定です。

filterまた、IE 固有のプロパティが IE9 で削除されたことも確認できます。

[編集]
人々はさらにいくつかのドキュメントを求めてきました。彼らが言うように、これはかなり限定的ですが、すべてのブラウザーでさまざまな CSS3 機能をテストするのに役立つページhttp://css3please.com/を見つけました。

しかし、IE9 プレビューでこのページの回転機能をテストすると、かなり見事にクラッシュしました。

ただし-ms-transform:rotate()、IE9 を使用して自分のテスト ページでいくつかの独立したテストを行ったところ、問題なく動作しています。したがって、私の結論は、機能は実装されていますが、おそらく動的に設定することに関連するいくつかのバグがあるということです。

どのブラウザに機能が実装されているかについてのもう 1 つの便利な参照ポイントは、www.canIuse.com です。http://caniuse.com/#search=rotation を参照してください。

[編集]
この古い回答を復活させるのは、最近、質問に関連し、物事を簡単にする可能性のあるCSS Sandpaperと呼ばれるハックについて知ったからです。

transformこのハックは、古いバージョンの IE 用の標準 CSS のサポートを実装しています。これで、CSS に次のコードを追加できます。

-sand-transform: rotate(10deg);

filter...そして、構文を使用することなく、IE 6/7/8 で動作するようにします。(もちろん、まだ裏でフィルター構文を使用していますが、他のブラウザーと同様の構文を使用しているため、管理がはるかに簡単になります)

于 2011-02-01T16:38:36.243 に答える
4

IE9 での変換にも問題があり、使用-ms-transform: rotate(10deg)しましたが、機能しませんでした。できる限りのことを試しましたが、問題はブラウザー モードにありました。変換を機能させるには、互換モードを「標準 IE9」に設定する必要があります。

于 2012-06-11T10:58:57.537 に答える