【CSS】要素を不透明～透明にする：opacity

文字・画像・要素を半透明にする

opacityを使うと、透明度を変えることができます。値は0～1を指定することができ、0が完全に透明です。

以下のCSSコードは、topというdiv要素に含まれるp要素の文字を半透明にしています。

.top p{
  opacity:0.5;
}

子要素に透明度を適用したくない場合

子要素に透明度を適用したくない場合には、backgroundから指定することで、子要素を無視することができます。

.top {
 background: rgba(0, 0, 0, 0.5);
}