¿Transparencia de color de relleno SVG/alfa?
¿Es posible establecer una transparencia o un nivel alfa en los colores de relleno SVG?
Intenté agregar dos valores a la etiqueta de relleno (cambiándola de fill="#044B94"
a fill="#044B9466"
), pero esto no funciona.
Aceptado
Utiliza un atributo adicional; fill-opacity
: Este atributo toma un número decimal entre 0,0 y 1,0, inclusive; donde 0.0 es completamente transparente.
Por ejemplo:
<rect ... fill="#044B94" fill-opacity="0.4"/>
Además tienes lo siguiente:
stroke-opacity
atributo para el trazoopacity
para todo el objeto
Como solución aún no completamente estandarizada (aunque en consonancia con la sintaxis de color en CSS3), puede utilizar, por ejemplo fill="rgba(124,240,10,0.5)"
, . Funciona bien en Firefox, Opera, Chrome.
He aquí un ejemplo .