Der "FilterEigenschaft kann verwendet werden, um verschiedene visuelle Effekte auf ein Bild anzuwenden, wie Reflexion, Graustufen, Sepia, Sättigung, Hue-Rotat und mehr. Die Kombination der damit verbundenen Funktionen der genannten visuellen Effekte in der Filtereigenschaft verändert die Farbe eines Bildes. Diese Funktionen verwenden unterschiedliche Farbkomponenten, um die Farbe des Bildes zu ändern.

In diesem Handbuch lernen Sie, wie Sie CSS verwenden, um die Farbe eines Bildes in Blau zu ändern.

So ändern Sie die Bildfarbe in CSS?

In CSS können Sie die Filtereigenschaft verwenden, um einen grafischen Effekt auf ein Bild oder zum Zweck der Farbverschiebung auf ein HTML -Element anzuwenden. Darüber hinaus kann es verwendet werden, um die Farbe des Bildes zu ändern. Gehen Sie also zunächst die Filtereigenschaft und ihre Funktionen durch.

CSS -Filtereigenschaft

Um den visuellen Effekt eines Bildes zu steuern, wird die Filtereigenschaft von CSS verwendet. Die unterstützten visuellen Effekte sind:

• • Farbanpassung
  • verwischen
  • Drop-Shadow
  • Helligkeit
  • Opazität

Syntax

Unser Ziel ist es, die Farbe eines Bildes in CSS mit der Filtereigenschaft in Blau zu ändern. Dazu folgen wir der angegebenen Syntax:

Filter: Sepia () | Hue-rotate () | sättigen()

Die Beschreibung der oben genannten Funktionen lautet:

• • Sepia(): Es wird verwendet, um ein Bild in ein Sepia -Bild umzuwandeln, indem es ihm ein bräunlich -gelbes Aussehen verleiht.
  • Hue-rotate (): Es wird verwendet, um die Farbtonrotation auf das Bild anzuwenden. Diese Funktion akzeptiert den erforderlichen Winkel für die Rotation als Argument.
  • sättigen(): Es wird verwendet, um die Sättigung auf einem Bild einzustellen. Diese Funktion akzeptiert einen Prozentsatz oder eine Zahl als Argument, das den Konversionsbetrag darstellt.

Um die oben genannten Punkte zu klären, wechseln wir zum Beispiel.

Schauen wir uns ein Beispiel an, um die Farbe eines Bildes mit den genannten Filtereigenschaftsfunktionen in Blau zu ändern.

Beispiel: So ändern Sie die Farbe eines Bildes in CSS in Blau?

Um die Farbe des Bildes in Blau zu ändern, geben Sie zunächst die Quelle des ausgewählten Bildes in der HTML -Datei an.

Hier haben wir ein Bild mit dem Tag hinzugefügt und seine Breite auf “gesetzt“450px”:

Ändern Sie die Farbe eines Bildes in Blau

Vor der Anwendung der Filtereigenschaft sieht unsere Webseite so aus:

Gehen Sie zum CSS und wenden Sie die Filtereigenschaft an, um die Farbe eines Bildes in Blau zu ändern.

Dazu setzen wir den Wert von Sepia (), Hue-Rotate () und sättigen () als "100%","190 Grad" Und "900%" bzw:

img
Filter: Sepia (100%) Hue-Rotat (190 °) gesättigt (900%);

Notiz: Die Abfolge der zusätzlichen Funktionen muss mit der gegebenen Funktionen übereinstimmen. Wenn Sie die angegebene Sequenz ändern, wird das Bild nicht den erforderlichen Effekt nutzen.

Speichern Sie nun Ihren Code und öffnen Sie die HTML -Datei in Ihrem Browser:

Beispiel 2: So ändern Sie die Farbe eines Bildes in hellblau?

Um die Farbe des Bildes auf hellblau zu ändern, werden die Werte von Sepia (), Hue-Rotate () und Sättigungen () geändert.

Hier fügen wir ein anderes Bild mit dem Tag hinzu:

Ändern Sie die Farbe eines Bildes auf hellblau

Gehen Sie nun in den CSS -Abschnitt und wenden Sie die “anFilterEigenschaft zum hinzugefügten Bild.

Hier setzen wir den Wert von Sepia () als "als" fest300%", Hue-rotate () als" als "150 GradUnd sättigen () als "450%”:

img
Filter: Sepia (300%) Hue-Rotat (150 °) gesättigt (450%);

Infolgedessen wird die Farbe des angegebenen Bildes in hellblau geändert.

Ausgang

Wir haben die einfachste Methode abgedeckt, um die Farbe eines Bildes in CSS in Blau zu ändern.

Abschluss

Die Farbe eines Bildes in Blau ändern, “Sepia()","Hue-rotate ()", Und "sättigen()"Funktionen der"FilterEigenschaften werden verwendet. Die Farbe des Bildes ändert sich entsprechend dem angegebenen Wert der Funktionen der Sepia (), Hue-Rotate () und sättigen (). Mit dieser. Wie wir in diesem Artikel erläutert haben, können Sie die CSS -Filtereigenschaft ermöglichen, die Farbe eines Bildes in Blau zu ändern.