CSS opacity() συναρτηση
- Προηγούμενη σελίδα Λειτουργία CSS oklch()
- Επόμενη σελίδα Λειτουργία CSS perspective()
- Επιστροφή στο προηγούμενο επίπεδο Εγχειρίδιο Αναφορών Λειτουργιών CSS
Ορισμός και χρήση
CSS opacity()
Οι συναρτήσεις φίλτρου χρησιμοποιούνται για την εφαρμογή του εφέ διαφάνειας στο στοιχείο.
- 100%(ή 1)χωρίς εφέ
- 50%(ή 0.5)κανάκι την ένδειξη 50% διαφανής
- 0%(ή 0)κανάκι την ένδειξη πλήρως διαφανή
Παράδειγμα
Παράδειγμα 1
Θέστε διαφορετική διαφάνεια στις εικόνες:
#img1 { filter: opacity(80%); } #img2 { filter: opacity(50%); } #img3 { filter: opacity(0.2); }
Παράδειγμα 2
θα opacity()
με backdrop-filter
Χρήση των ιδιοτήτων μαζί:
div.transbox { background-color: rgba(255, 255, 255, 0.4); -webkit-backdrop-filter: opacity(50%); backdrop-filter: opacity(50%); padding: 20px; margin: 30px; font-weight: bold; }
Γλώσσα CSS
opacity(amount)
Τιμή | Περιγραφή |
---|---|
amount |
Προαιρετικό. Προσδιορίζει το αριθμητικό ή το ποσοστό της διαφάνειας. Το 0%(ή 0)κανάκι την ένδειξη πλήρως διαφανή. 100%(ή 1)προσδιορίζει την αρχική εικόνα (χωρίς εφέ). Η προεπιλεγμένη τιμή είναι 1. |
Τεχνικά λεπτομέρειες
Έκδοση: | CSS Filter Effects Module Level 1 |
---|
Υποστήριξη του προγράμματος
Τα αριθμήματα στη τύχη δείχνουν την έκδοση του πρώτου προγράμματος που υποστηρίζει τη συναρτηση.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
18 | 12 | 35 | 6 | 15 |
Σχετικές σελίδες
Αναφορά:CSS filter ιδιότητα
Αναφορά:CSS blur() συναρτηση
Αναφορά:CSS brightness() συναρτηση
Αναφορά:CSS contrast() συναρτηση
Αναφορά:CSS drop-shadow() συναρτηση
Αναφορά:CSS grayscale() συναρτηση
Αναφορά:CSS hue-rotate() συναρτηση
Αναφορά:CSS invert() συναρτηση
Αναφορά:Λειτουργία CSS saturate()
Αναφορά:Λειτουργία CSS sepia()
- Προηγούμενη σελίδα Λειτουργία CSS oklch()
- Επόμενη σελίδα Λειτουργία CSS perspective()
- Επιστροφή στο προηγούμενο επίπεδο Εγχειρίδιο Αναφορών Λειτουργιών CSS