IE用テキストシャドウ

Question

私はウェブサイトを構築していますが、テキストシャドー機能を使用していますが、IEでは機能しません。

グラフィック：

text-shadow: 0.1em 0.1em 0.2em black; 

は、任意の解決策はありますかにわたり、これを来てハック、またはIE用のテキストシャドウ機能を模倣何か。

Answer 1

IEの一部のバージョンでは、ドロップシャドウフィルタは、必要なものを行うことがあります。私は、背景画像の上に重ねたときに動作するクロスブラウザのテキストストロークのソリューションを探していました

http://msdn.microsoft.com/en-us/library/ms532985%28v=vs.85%29.aspx

Answer 2

。私は余分なマークアップ、jsとIE7 - 9（私は6をテストしていない）で動作し、エイリアシングの問題を引き起こさない含まれていないための解決策があると思う。

これは、CSS3のテキストシャドウ（which has good support except IE）を使用し、次にIE用のフィルタの組み合わせを使用する組み合わせです。現時点でCSS3のテキストストロークのサポートは貧弱です。

IEフィルタ：

グローフィルタlooks terribleので、私はそれを使用していませんでした。

David Hewitt's answerには、方向の組み合わせでドロップシャドウフィルタを追加する作業が含まれていました。 ClearTypeは残念なことに削除され、ひどく別名のテキストになります。

次に、useragentmanで提案された要素のいくつかをドロップシャドウフィルタと組み合わせました。

この例では、白ストロークで黒テキストであろう一緒

それを置きます。私はIE（http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/）をターゲットにする方法で条件付きHTMLクラスを使用しています。

#myelement { 
    color: #000000; 
    text-shadow: 
    -1px -1px 0 #ffffff, 
    1px -1px 0 #ffffff, 
    -1px 1px 0 #ffffff, 
    1px 1px 0 #ffffff; 
} 

html.ie7 #myelement, 
html.ie8 #myelement, 
html.ie9 #myelement { 
    background-color: white; 
    filter: progid:DXImageTransform.Microsoft.Chroma(color='white') progid:DXImageTransform.Microsoft.Alpha(opacity=100) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=1,offY=1) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=-1,offY=1) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=1,offY=-1) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=-1,offY=-1); 
    zoom: 1; 
} 

Answer 3

IEフィルタクラスでは、あなたが持っている背景画像にも影ができます。例えば、私は背景の一部として行を持つH1タグを持っています.IEのテキストシャドウフィルタを置くと、バックグラウンドの線はその影を継承します。

Answer 4

私はこの問題を今も調査しており、IE10で自分のサイトをテストしている間に矛盾した発見を共有したいと考えています。

私は、このHTML構造を持っている：

CSSと組み合わせ

<p>Meer info op onze <a class="links" target="_self" href="/leden">ledenpagina</a></p> 

：私はIE10でこの結果を見れば

p { display: inline-table; 
    color: #FFF; 
    text-shadow: 0px 1px 2px #111, 0px 1px 0px #111; 
    margin: 0px 20px; } 

a.links { 
    text-decoration: underline; 
    color: #FFFF60; 
    font-size: 1.1em; } 

、achorテキスト "ledenpaginaは、" テキストベースを受けません親（pタグ）で定義されているシャドウスタイル。 仮定これは組み合わせたテキストの装飾とは何かを持っている可能性があり：http://tczelem.beヘッダスライダーダウン（スライド：下線セレクタは

結果がここに目撃することができます（pタグでもテキストの装飾を加えることによりテスト）虚偽でしたタブ）

したがって、テキスト装飾セレクタはIE10で効果があるようです。

！[ここに画像の説明を入力します] [2]