Eyecatch html css

HTML,CSS

【CSS】CSSで背景のみ透明度を操作(文字や画像は透過させない)する方法。

2015/01/24

背景色を黒とした適当なボックスを作成し、画像、テキストを配置。
そのボックスの透明度を操作する時に opacity を使うと、文字や画像までもが透過してしまいます。
こういう場合の適切な方法。

先ほどの内容をCSSで書くとこんな感じ。

上記内容では、配置した画像やテキストまでもが一緒に透過してしまいます。
背景のみを透過させたいって場合は、下記の書き方にすると幸せになれます。

ベンダープレフィックスもなく、スッキリしましたね。

よく考えたら、 opacity の出番が無くなる感じがします(苦笑)

-HTML,CSS
-, , ,