Autor publikacji
Virtual Patriot - Administrator

contrast()

Data publikacji
Ostatnio edytowano

Przeznaczenie funkcji contrast()

Za pomocą funkcji contrast() możemy określić procent zróżnicowania koloru.

Parametry funkcji contrast()

Przykładowe zapisy

contrast(170%)

contrast(1.7)

contrast(267.8%)

contrast(2.678)

percent

Parametr percent jest wymaganym parametrem funkcji contrast(). Parametr percent określa procent zróżnicowania (kontrastu) koloru. Im większy procent tym kontrast koloru będzie większy.

Zakres wartości

od 0 w górę (procenty lub dowolna liczba)

Wartość domyślna

100% (równoznaczna z wartością 1)

Występowanie funkcji contrast()

  1. filter
  2. backdrop-filter

Przykład funkcji contrast()

  filter:contrast(160%);
obrazek przed zmianą kolorystyki za pomocą funkcji contrast() obrazek po zmianie kolorystyki za pomocą funkcji contrast()

Procent zróżnicowania kolorów przykładowego elementu "img" został zmieniony, ponieważ do wspomnianego elementu "img" została dodana właściwość "filter" wraz z wartością w postaci funkcji "contrast()", w której to funkcji została użyta wartość "160%".

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      img {
        filter:contrast(160%);
      }
    </style>
  </head>

  <body>

    <img src="https://webkod.pl/files/css/zwierze-01.png" alt="zdjęcie lwa">

  </body>
</html>

Interpretacja funkcji contrast()

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

nie

Edge

tak

Zobacz więcej informacji o interpretacji funkcji .