背景、グリーン、ライムの3層構造。
グリーンにはopacity: .5;
をかけている。
手前のライムは、opacity: 1;
で、アニメーションで一時的に透過になる。
手前の要素に、後ろの要素のopacity
を影響させたくない場合は、
手前の要素を後ろの要素の中へ入れ子にしないで、兄弟要素として書く。
そうすれば、後ろの要素にopacity
が掛かっていても、手前の要素は透過されない。