Sombra de texto para IE

Question

Estoy construyendo un sitio web y estoy usando la función de sombra de texto, pero no funciona para IE.

Gráfico:

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

¿Hay alguna solución o truco para venir sobre esto, o algo que imita la función de sombra de texto para IE.

Answer 1

Para algunas versiones de IE, filtro de Dropshadow puede hacer lo que se necesita:

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

Answer 2

que estaba buscando una solución texto tiempos multi-navegador que funciona cuando se superponen sobre las imágenes de fondo. Creo que tengo una solución para esto que no implica margen extra, js y funciona en IE7-9 (no he probado 6), y no causa problemas de aliasing.

Esta es una combinación de usar CSS3 text-shadow, which has good support except IE, y luego usar una combinación de filtros para IE. El soporte de trazo de texto CSS3 es pobre en este momento.

IE Filtros:

El filtro de iluminado looks terrible, así que no usaron eso.

David Hewitt's answer implicó la adición de filtros de sombras en una combinación de instrucciones. ClearType se elimina por desgracia, así que terminamos con un texto mal alias.

Luego combiné algunos de los elementos sugeridos en useragentman con los filtros de gotas.

Juntando todo

Este ejemplo podría ser texto negro con un trazo blanco. Estoy usando clases HTML condicionales por cierto para atacar IE (http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/).

#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

La clase de filtro de IE también pone una sombra en cualquier imagen de fondo que tenga. Por ejemplo, tengo una etiqueta H1 que tiene una línea como parte del fondo, cuando coloco el filtro de sombra de texto de IE, la línea en el fondo hereda esa sombra.

Answer 4

He estado buscando e investigando este problema también desde hace algún tiempo y me gustaría compartir un hallazgo tal vez contradictorio al probar mi sitio en IE10.

que tienen esta estructura html:

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

combina con CSS:

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; } 

si miro el resultado de esto en IE10, el texto achor "ledenpagina" hace recibir el texto: estilo de sombra como se define en el elemento primario (etiqueta p). El supuesto esto podría tener algo que ver con un texto-decoración combinado: underline selector era falsa (probado mediante la aplicación de text-decoration también en la etiqueta p)

El resultado puede ser visto aquí: http://tczelem.be (deslice hacia abajo el deslizador de cabecera pestaña)

Así que el selector de decoración de texto parece tener algún efecto en IE10.

! [Enter descripción de la imagen aquí] [2]