-
Cómo hacer Look texto perforado en CSS
-
La propiedad "text-shadow" en CSS hace posible una serie de efectos de texto visuales, tales como sombras, texto brillante y el texto perforada de entrada. También conocido como texto "prensa de la letra", el perforado, en efecto, utiliza una sombra de texto con un ligero desplazamiento, falta de definición sutil y de color claro. Este efecto funciona mejor en fondos oscuros, y no funciona sobre un fondo blanco en absoluto. La mayoría de los navegadores modernos apoyan esta "sombra de texto", aunque Internet Explorer no lo hace.
Instrucciones
1 Abra la página Web y encontrar "<style>" etiquetas "entre los <head>" etiquetas en el código HTML. Añadir este código si usted no ve "<style>" etiquetas:
<Style type = "text / css">
</ Style>
2 Añadir un nombre de clase, tales como "perforada" a cualquier etiqueta en la que desea mostrar el texto con el puched en efecto:
<P class = "perforada"> Párrafo ... </ p>
<P class = "red puñetazos"> punto rojo ... </ p>
Nótese cómo el segundo párrafo en el ejemplo utiliza dos nombres de clase. Si encuentra la etiqueta ya se utiliza un nombre de clase, asigne un segundo y separar con un espacio entre cada nombre.
3 Crear una regla de estilo para su nueva clase entre los "<style>" etiquetas:
.punched {
}
Prefijar su nombre de clase en CSS usando un punto, como se muestra en este ejemplo.
4 Agregue la propiedad "text-shadow" para que la nueva regla de estilo. Dar a la sombra de un desplazamiento desde la parte superior e izquierda, una falta de definición de un píxel y un color claro de un píxel:
.punched {
text-shadow: 1px 1px 1px #ffffff;
}
Consejos y advertencias
- Dado que Internet Explorer no es compatible con las sombras del texto, elegir los colores que mantienen su texto legible incluso sin las sombras.