Si una imagen de fondo o un color de fondo están configurados con opacity en CSS y se superpone texto, es posible que se adopte la configuración del elemento padre y que los elementos hijos también se vuelvan transparentes.
See the Pen CSS-opacity_hex_esp by AGUA Web (@AGUA) on CodePen.
Al intentar eliminar la configuración de transparencia de un elemento hijo, poner opacity:1; no funciona aunque se utilice opacity:1!important;, lo que obliga a utilizar la configuración del elemento padre.
En este caso, especificar el color de fondo del elemento padre y el ajuste de transparencia como ‘rgba’ en lugar de números hexadecimales como #000000; parece resolver el problema (eliminar el ajuste de opacidad del elemento padre).
See the Pen Untitled by AGUA Web (@AGUA) on CodePen.
Se han utilizado como referencia los siguientes sitios, incluida la conversión de los códigos de color de hexadecimal a rgba. Muchas gracias.
Herramienta de conversión de códigos de color
https://tech-unlimited.com/color.html