0

CSS でこのプロパティを使用して、IE のグラデーションを作成しています。

.icons,
#nav {
filter: progid:DXImageTransform.Microsoft.gradient(   startColorstr='#9e9ccf', endColorstr='#423f88', GradientType=0 ); /* IE6-9 */
}

これを適用すると、予想どおりきれいなグラデーションが表示されます。ただし、アイコンに border-radius が適用されなくなり、#nav z-index が失敗し、サブメニューが期待どおりに読み込まれず、#nav の高さと幅に基づいて切り取られます。すべての IE で。

4

1 に答える 1

0

IE の古い独自のfilterスタイルは と互換性がありませんborder-radius。それらは、四角い角を持つ activeX コントロールを使用し、使用しようとする丸みを帯びた角をオーバーライドします。これは既知のバグであり、回避策はありません。

ActiveX コントロールであることのもう 1 つの問題はfilter、activeX コントロールが持つすべてのバグと癖が伴うことです。これには、レイヤーを台無しにすることや、そのような他の楽しいことが含まれます。私のアドバイスは、絶対に使用filterしないことです。

border-radiusとにかくIE9以上でのみ機能することに注意してください。そのため、それに関する問題はIE8以前には当てはまりません。

解決策: CSS3Pieを試すことをお勧めします。これは、IE6 から IE9 にプラグインする JavaScript ライブラリであり、これらのブラウザーで標準の CSS3 グラデーションをより適切にサポートできるようにします。VML グラフィックスを使用してそれを行うため、 を使用する必要がなく、グラデーションが引き起こす可能性filterのあるバグがありません。filter(独自の癖がいくつかありますが、比較するとマイナーであり、簡単に回避でき、CSS3Pie サイトで十分に文書化されています)。もう 1 つの利点は、IE の古いバージョンを含むすべてのブラウザーで標準の CSS コードを使用できることです。大勝利。

ああ、それborder-radiusはIE6-8にも当てはまります。これはあなたにとって追加のボーナスです. （そして、はい、グラデーションでうまく機能します）

それが役立つことを願っています。

于 2013-04-17T11:01:59.513 に答える