ホームページ  >  記事  >  ウェブフロントエンド  >  CSSを使って画像を透明にする方法

CSSを使って画像を透明にする方法

(*-*)浩
(*-*)浩オリジナル
2020-01-10 15:38:322146ブラウズ

CSSを使って画像を透明にする方法

CSS を使用して透明な画像を作成するのは簡単です。 (推奨学習: CSS チュートリアル)

注: CSS の不透明度プロパティは、W3C CSS 推奨標準の一部です。

例 1 - 透明な画像を作成する

透明効果を定義する CSS3 プロパティは不透明度です。

最初に、CSS を使用して透明な画像を作成する方法を説明します。

通常の画像:

CSSを使って画像を透明にする方法

# 同じ画像を透明化:

CSSを使って画像を透明にする方法

次の CSS を参照してください:

img
{
opacity:0.4;
filter:alpha(opacity=40); /* 针对 IE8 以及更早的版本 */}

IE9、Firefox、Chrome、Opera、Safari では、不透明度プロパティを使用して透明度を設定します。不透明度プロパティは 0.0 から 1.0 までの値に設定できます。

値が小さいほど透明度が高くなります。 IE8 以前ではフィルター filter:alpha(opacity=x) を使用します。 x は 0 から 100 までの値を取ることができます。値が小さいほど透明度が高くなります。

以上がCSSを使って画像を透明にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。