CSS3で透過指定

お疲れ様です。
５月１日に入社した三輪です。

今回エンジニアブログが初めて自分に回ってきたのですが、
書くネタがなさ過ぎて投稿が遅れました。
すみません。。

だいぶ前にCSS3の勉強をしていた時に、
こんなスタイル指定ができるようになったのかと感動した指定方法があったので、
ちょっとマイナーですがご紹介します。


背景色の透過

■背景色：skyblue(透過なし)

何もしない状態

■背景色：skyblue(透過あり opacity)

背景/文字が透過

■背景色：skyblue(透過あり CSS3でrgba指定)

背景だけ透過

【ソース(CSS/HTML)】

div#one {
  background:skyblue; opacity: 0.5;
}
div#two {
  background-color:rgba(135,206,250,0.5);
}
※0.5の部分が透過値

<p>■背景色：skyblue(透過なし)</p>
<div>何もしない状態</div>
<p>■背景色：skyblue(透過あり opacity)</p>
<div id="one">背景/文字が透過</div>
<p>■背景色：skyblue(透過あり CSS3でrgba指定)</p>
<div id="two">背景だけ透過</div>

エンジニアとしてまだまだ未熟なので、
これから色々と知識を身につけ、
成長していきたいと思っています。
それでは、今後ともよろしくお願いします。