Palabras clave de color CSS
Esta página explicará las palabras clave transparent
, currentcolor
y
inherit
.
La palabra clave transparente
La transparent
palabra clave se utiliza para hacer que un color sea transparente. Esto se usa a menudo para hacer un color de fondo transparente para un elemento.
Ejemplo
Aquí, el color de fondo del elemento <div> será totalmente transparente y la imagen de fondo se mostrará:
body {
background-image: url("paper.gif");
}
div {
background-color: transparent;
}
Nota: La transparent
palabra clave es equivalente a rgba(0,0,0,0). Los valores de color RGBA son una extensión de los valores de color RGB con un canal alfa, que especifica la opacidad de un color. Lea más en nuestro capítulo CSS RGB y en nuestro capítulo Colores CSS .
La palabra clave de color actual
La currentcolor
palabra clave es como una variable que contiene el valor actual de la propiedad de color de un elemento.
Esta palabra clave puede ser útil si desea que un color específico sea consistente en un elemento o una página.
Ejemplo
En este ejemplo, el color del borde del elemento <div> será azul, porque el color del texto del elemento <div> es azul:
div {
color: blue;
border: 10px solid currentcolor;
}
Ejemplo
En este ejemplo, el color de fondo de <div> se establece en el valor de color actual del elemento del cuerpo:
body {
color: purple;
}
div {
background-color:
currentcolor;
}
Ejemplo
En este ejemplo, el color del borde y el color de la sombra de <div> se establecen en el valor de color actual del elemento del cuerpo:
body {
color: green;
}
div {
box-shadow: 0px 0px
15px currentcolor;
border: 5px solid currentcolor;
}
La palabra clave heredar
La inherit
palabra clave especifica que una propiedad debe heredar su valor de su elemento principal.
La inherit
palabra clave se puede utilizar para cualquier propiedad CSS y en cualquier elemento HTML.
Ejemplo
En este ejemplo, la configuración del borde de <span> se heredará del elemento principal:
div {
border: 2px solid red;
}
span {
border:
inherit;
}