Συνάρτηση contrast CSS

Ορισμός και χρήση

Η CSS contrast() Οι συνάρτησεις φίλτρου χρησιμοποιούνται για την ρύθμιση της αντίθεσης του στοιχείου.

• 0% κάνει την εικόνα πλήρως γκρι
• 100% (ή 1) είναι η προεπιλεγμένη τιμή, που υποδηλώνει την αρχική εικόνα
• Οι τιμές πάνω από 100% αυξάνουν την αντίθεση
• Οι τιμές κάτω από 100% μειώνουν την αντίθεση

Παράδειγμα

Παράδειγμα 1

Αύξηση και μείωση της αντίθεσης της εικόνας:

#img1 {
  filter: contrast(150%);
}
#img2 {
  filter: contrast(50%);
}

Δοκιμάστε το προσωπικά

Παράδειγμα 2

θα contrast() με backdrop-filter Χρήση συνδυασμένων ιδιοτήτων:

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: contrast(150%);
  backdrop-filter: contrast(150%);
  padding: 20px;
  margin: 30px;
  font-weight: bold;
}

Δοκιμάστε το προσωπικά

Γλώσσα CSS

contrast(amount)

Τεχνικά λεπτομέρειες

Υποστήριξη του προγράμματος περιήγησης

Τα αριθμήματα στη τάβλη αποδίδουν την έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως τη συνάρτηση.

Σχετικές σελίδες

Reference:CSS filter attribute

Reference:Συνάρτηση blur CSS

Reference:Συνάρτηση brightness CSS

Reference:Συνάρτηση drop-shadow CSS

Reference:Συνάρτηση grayscale CSS

Reference:Συνάρτηση hue-rotate CSS

Reference:Συνάρτηση invert CSS

Reference:Συνάρτηση οπτικότητας CSS

Reference:CSS saturate() function

Reference:CSS sepia() function