【CSS】親要素で設定したopacityプロパティを子要素で解除する |

CSSで背景画像や背景色に透過（opacity）設定をして、文字を重ねると親要素の設定を引き継ぎ子要素も透明になってしまう場合があります。

See the Pen
CSS-opacity_hex by AGUA Web (@AGUA)
on CodePen.

子要素の透過設定を解除しようと、opacity:1;を入れてもopacity:1!important;としても効かず親要素の設定を強制的に引き継いでしまいます。

この場合、親要素の背景色および透過設定を#000000;などの16進数ではなく「rgba」で指定すると解決するようです（親要素のopacity設定は削除します）

See the Pen
CSS-opacity_rgba by AGUA Web (@AGUA)
on CodePen.

カラーコードの16進数→rgbaへの変換など、下記サイトを参考にさせていただきました。ありがとうございました。

【CSS】親要素で設定したopacityプロパティを子要素で解除する