2011-03-05 18 views
16

Quiero hacer texto brillante en HTML y CSS. Estoy siguiendo este tutorial.Cómo hacer texto brillante en HTML y CSS

http://msdn.microsoft.com/en-us/library/gg589484(v=VS.85).aspx#creating_%22glow%22_effects_with_drop_shadows

Quiero el texto a brillar, al igual que el de minimizar, maximizar y botones de salida en Windows Vista y 7 resplandor cuando se pasa sobre ellos.

He leído 8 tutoriales en línea, todos diciendo que SOLO FILTRO funciona en IE (Completo BS por cierto, estoy usando IE9 RC y que ni siquiera se muestra), por lo que ninguno de los tutoriales que he encontrado sobre brillando realmente funciona para texto como <p>, <a> <h1> etc.

¿Cómo puedo hacer que mi texto brille en el aire estacionario? (sin imágenes)

+1

CSS3 aún no es compatible. – yoda

+0

Pero, de acuerdo. No está bien respaldado ... todavía. Esta bien. Pero el efecto de resplandor obviamente funciona en div's, simplemente no entiendo cómo no funcionará para el texto. –

+2

IE9 dejó de admitir 'filtro', creo, porque no es estándar. Sin embargo, de alguna manera * no * admite la propiedad 'text-shadow', que es muy molesto –

Respuesta

32

Quizás juegues con la sombra de texto CSS3.

text-shadow: #EEEE00 0 0 10px; 

IE8 y abajo no va a apoyar, pero ahí es donde filter viene muy bien.

filter: glow(color=#EEEE00,strength=3); 

P.S. Una pequeña y práctica característica de la propiedad text-shadow de CSS3 es que permite múltiples sombras.

text-shadow: #EEEE00 0 0 10px, #FF0000 5px 5px 5px; 
+0

Gracias por su respuesta. * text-shadow: # EEEE00 0 0 10px; * No funciona en IE9 RC o IE9 Beta, no hay cambios en el texto y la última muestra de sombra de texto tampoco funciona. : -S –

+1

Ahh cierto, http://msdn.microsoft.com/en-us/library/cc351024%28v=vs.85%29.aspx búsqueda de sombra de texto, no hay soporte! Microsoft falla una vez más. – Marko

+1

Estoy harto de oír la excusa genérica de que "CSS3 todavía está en borrador" y "HTML5 todavía está en borrador": si ese es el caso, ¿por qué Chrome ya admite la característica X en HTML5 o la característica Y en CSS3? ¿Por qué Flock es compatible con esto? ¿Por qué Opera admite eso? ¿Y por qué IE9 no es compatible con la mayoría de lo que otros navegadores ya soportan? Este tipo de cosas es suficiente para convertirme en un psicópata en toda regla jajaja. –

0

Si usted cree que tiene una respuesta a esta pregunta, por favor, por todos los medios que comparten. Como no voy a renunciar a esto. Quiero el efecto de brillo en el texto tanto como quiero mi café cada mañana.

Me han encontrado una solución medio-cr p media buena, * en el ínterin:

<DOCTYPE html> 
<html> 
<head> 
<title>HTML5 &amp; CSS3 Samples</title> 
<style> 
    p { 
    filter:progid:DXImageTransform.Microsoft.Glow(Strength, Color, Enabled); 
    } 
</style> 
</head> 
<body> 
<center> 
<p>Welcome!</p> 
</center> 

</body> 
</html> 
+1

Um. No recuerdo escribir un párrafo entero dos veces. –

+0

jajaja tal vez tiempo para ver a un médico? – Marko

+0

Posiblemente. Sin embargo, debo hacer que mi texto brille antes de comprometerme (o que alguien más me comprometa) jaja: P - Pero con toda seriedad, Texto resplandeciente; Uno pensaría que con todas las cosas geniales que se pueden lograr en este momento en Diseño Web, incluso antes de HTML5/CSS3, habrás pensado, tal vez incluso esperado, que podrías iluminar un poco el texto jajaja. –

1

probar este truco CSS3!

.text-glow {/*Definig font could be useful!*/ 
    font-size:4em; 
    color: #FFFFFF; 
    font-family:Arial; 
    } 
.text-glow:hover { 
text-shadow: 1px 0px 20px #ffd200; 
-webkit-transition: 1s linear 0s; 
-moz-transition: 1s linear 0s; 
-o-transition: 1s linear 0s; 
transition: 1s linear 0s; 
outline: 0 none; 
    } 
Cuestiones relacionadas