Saltar al contenido

Colores hexadecimales: ¿Representación numérica para “transparente”?

Después de mucho batallar hemos dado con el arreglo de este contratiempo que ciertos los usuarios de este sitio web presentan. Si tienes algo más que compartir no dejes de compartir tu comentario.

Solución:

HEXA – #RRGGBBAA

Hay una forma relativamente nueva de hacer transparencia, se llama HEXA (HEX + alfa). Toma 8 dígitos en lugar de 6. El último par es Alfa. Así que el patrón de pares es #RRGGBBAA. Tener 4 dígitos también funciona: #RGBA

No estoy seguro de la compatibilidad de su navegador por ahora, pero puede consultar el BORRADOR Documentos para más información.

§ 4.2. Las notaciones hexadecimales RGB: #RRGGBB

La sintaxis de un es un simbólico cuyo valor consta de 3, 4, 6 u 8 dígitos hexadecimales. En otras palabras, un color hexadecimal se escribe como un carácter hash, “#”, seguido de una cierta cantidad de dígitos. 0-9 o letras a-f (no importa el caso de las letras – #00ff00 es idéntico a #00FF00).

8 dígitos

Los primeros 6 dígitos se interpretan de manera idéntica a la notación de 6 dígitos. El último par de dígitos, interpretado como un número hexadecimal, especifica el canal alfa del color, donde 00 representa un color totalmente transparente y ff representan un color completamente opaco.

Ejemplo 3
En otras palabras, #0000ffcc representa el mismo color que rgba(0, 0, 100%, 80%) (un azul ligeramente transparente).

4 dígitos

Esta es una variante más corta de la notación de 8 dígitos, “expandida” de la misma manera que la notación de 3 dígitos. El primer dígito, interpretado como un número hexadecimal, especifica el canal rojo del color, donde 0 representa el valor mínimo y f representa el máximo. Los siguientes tres dígitos representan los canales verde, azul y alfa, respectivamente.

En su mayor parte, Chrome y Firefox han comenzado a admitir esto:
ingrese la descripción de la imagen aquí

La transparencia es una propiedad ajena al propio color, también conocida como alpha componente. No puedes codificarlo como RGB.

Si quieres un fondo transparente, puedes hacer esto:

background: transparent;

Además, no sé si podría ser útil o no, pero podría configurar el opacity propiedad:

.half
  opacity: 0.5;
  filter: alpha(opacity=50);

Necesita ambos para que funcione en IE y en todos los demás navegadores decentes.

El canal alfa define el valor de transparencia de un color, por lo que cualquier color es 100 % transparente siempre que el valor alfa sea 0. Por lo general, este tipo de color de cuatro canales se conoce como RGBA.

Puede especificar RGBA en CSS así:

div 
    background: rgba(200, 54, 54, 0.5); /* 50% transparent */

Tenga en cuenta que no todos los navegadores admiten RGBA, en cuyo caso puede especificar un retroceder:

div 
    background: rgb(200, 54, 54); /* fallback */
    background: rgba(200, 54, 54, 0.5); /* 50% transparent */

Puede encontrar más información sobre la compatibilidad con el navegador y las soluciones alternativas aquí.

Sección de Reseñas y Valoraciones

Te invitamos a confirmar nuestro estudio dejando un comentario y dejando una valoración te damos la bienvenida.

¡Haz clic para puntuar esta entrada!
(Votos: 2 Promedio: 3)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *