La propiedad text-shadow en CSS se usa para agregar sombras al texto. Esta propiedad acepta una lista de sombras que se van a aplicar al texto, separadas por coma. El valor predeterminado de la propiedad text-shadow es ninguno.
Sintaxis:
text-shadow: h-shadow v-shadow blur-radius color|none|initial| inherit;
Valores de propiedad:
- h-shadow: esta propiedad es necesaria y se utiliza para especificar la posición de la sombra horizontal. Acepta los valores negativos.
- v-shadow: esta propiedad es necesaria y se utiliza para especificar la posición de la sombra vertical. También acepta los valores negativos.
- blur-radius: Se utiliza para establecer el radio de desenfoque. Su valor predeterminado es 0 y es opcional.
- none: No representa ninguna sombra añadida al texto, este es el valor por defecto.
- color: Se utiliza para establecer el color de la sombra. es opcional
- initial: se utiliza para establecer la sombra de texto en su valor predeterminado.
- heredar: esta propiedad se hereda de su elemento padre.
Ejemplo: Este ejemplo muestra el uso de la propiedad text-shadow con valores específicos asignados en píxeles.
HTML
<!DOCTYPE html>
<html>
<head>
<title> CSS | text-shadow Property </title>
<style>
h1 {
text-shadow: 5px 5px 8px #00FF00;
}
</style>
</head>
<body>
<h1> GeeksforGeeks </h1>
</body>
</html>
Producción:
Navegadores compatibles: los navegadores compatibles con la propiedad text-shadow se enumeran a continuación:
- Google Chrome 2.0
- Internet Explorer 10.0
- Microsoft Edge 12.0
- Firefox 3.5
- Ópera 9.5
- Safari 1.1
Publicación traducida automáticamente
Artículo escrito por chaitanyashah707 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA