html - IE のテキスト シャドウ

Question

IE でのテキスト シャドウの作成に関する Stackoverflow の記事を見つけました: StackQuestion ここで、そこにあるすべての「フィルター」ソリューションを試してみました。

IE の適切なテキスト シャドウ テクニックを知っている人はいますか? IE9だけでも…

ありがとうございました

Answer 1

このサイトをチェックしてください：http：//css3pie.com/

これは、IE6-9でCSS3を使用できるようにするプラグインです。

Answer 2

Internet Explorer でテキストの影の効果を得ることができます。IE のぎこちないフィルターの影の効果を手なずけ、強制的に見栄えを良くし、テキストのピクセル化を止めます。IE Chroma フィルターを使用します。

• 影の色に近いが同じではない背景色を設定します。たとえば、黒い影の場合は濃い灰色、白い輝きの場合は薄い灰色です。
• (IE のみのクラスまたは条件付きコメント内のスタイルシートまたはスタイル ルールで背景色を設定して、他のすべてのブラウザーでデザインを台無しにしないようにしてください!)
• IE フィルターの CSS ルールの前に、背景の塗りつぶしと同じ色に設定された Chroma フィルターを追加します。
• 見た目は（ほぼ）かなり良いです！

jsfiddle の例(IE8、IE9 でロード)

...または、IE8/9 に簡単にアクセスできない場合は、IE9 IE8 モードでのそのフィドルのスクリーンショットを次に示します。IE のデフォルト フィルタである恐ろしい、アーティファクトに満ちた、ピクセル化されたごちゃごちゃしたフィルタと、非常に鮮明で正常に見える Chroma フィルタの同等品との違いに注目してください。

CSS コード例。彩度フィルターと別のフィルターがすべて 1 行にあり、1 つの行に対して引用符で囲まれていることに注意してください。また、-ms-filter彩度の色が背景色と正確に一致する方法と、彩度の色が主な効果をどのように補完するか (ただし一致しません) に注意してください。色：

.chroma-glow {
    background-color: #dfdfdf;
    -ms-filter: "progid:DXImageTransform.Microsoft.Chroma(Color=#dfdfdf)progid:DXImageTransform.Microsoft.Glow(color=ffffff,strength=4)";
}
.chroma-shadow {
    background-color: #dfdfdf;
    -ms-filter: "progid:DXImageTransform.Microsoft.Chroma(Color=#dfdfdf)progid:DXImageTransform.Microsoft.Shadow(direction=135,strength=2,color=ffffff)";
}

---

いくつかの要件（苦労して学んだ...）

• 要素はblockまたはinline-blockでなければなりませんinline。
• フィルタはposition: relative;、またはposition: absolute;
  • position: absolute;(または `position: relative; 要素に直接適用すると機能します)
• フィルタを動的に追加する場合、たとえば のような jQuery を$elem.css('filter','progid...');使用する場合、クロマを機能させるにはフィルタを使用して背景色を要素に直接適用する必要があるようです。いくつかのヒント:
  • 効果色、適用された背景色、彩度の色をすべて同じにする
  • この背景色は IE でのみ必要になるため、機能検出または IE 検出を使用します。

Answer 3

#element {  
    filter: glow(color=black,strength=5);  
}