ホームページ  >  記事  >  ウェブフロントエンド  >  FirefoxのCSSで画像をグレーにする方法

FirefoxのCSSで画像をグレーにする方法

王林
王林オリジナル
2020-11-27 14:03:541978ブラウズ

Firefox で CSS を使用して画像をグレーに変換する方法: これは、属性 [-webkit-filter:grayscale(100%);] を使用して実現できます。フィルター属性は、ぼかしや彩度などの要素の視覚効果を定義します。

FirefoxのCSSで画像をグレーにする方法

このチュートリアルの動作環境: Windows 10 システム、HTML5&&CSS3 バージョンこの方法は、すべてのブランドのコンピューターに適しています。

(推奨チュートリアル: css ビデオ チュートリアル)

属性の紹介:

filter 属性は要素のコンテンツ (通常は FirefoxのCSSで画像をグレーにする方法) を定義します。視覚効果 (ぼかしや彩度など)。

属性値:

grayscale(%) 画像をグレースケール画像に変換します。値は変換のスケールを定義します。値が 100% の場合、画像は完全にグレースケールに変換され、値が 0% の場合、画像は変更されません。 0% から 100% までの値は、効果の線形乗数です。設定されていない場合、値はデフォルトの 0 になります。

コード例:

FirefoxのCSSで画像をグレーにする方法

実装効果:

FirefoxのCSSで画像をグレーにする方法

(関連する推奨事項: CSS チュートリアル )

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

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