Η color-adjustιδιότητα περιγράφεται από τις προδιαγραφές ως "διατήρηση χρωμάτων σε συσκευές διαφορετικών δυνατοτήτων". Ξέρετε πώς υπάρχουν τηλέφωνα, tablet και άλλες συσκευές εκεί έξω χωρίς οθόνες ποιότητας αμφιβληστροειδούς; Λοιπόν, αυτή η ιδιότητα παρέχει στο πρόγραμμα περιήγησης μια υπόδειξη για τη λήψη αποφάσεων σχετικά με τον τρόπο χειρισμού χρωμάτων βάσει αυτής της ποιότητας.
Ίσως σκέφτεστε κάτι σύμφωνα με το, "Περιμένετε, δεν είναι κόκκινο μόνο κόκκινο;" Και, ναι, αυτό είναι απολύτως αλήθεια. Ποιο είναι το σημείο βελτιστοποίησης ή προσαρμογής ενός χρώματος που είναι αληθές όπου κι αν εμφανίζεται;
Το θέμα είναι ότι τα προγράμματα περιήγησης τείνουν ήδη να κάνουν αυτούς τους προσδιορισμούς και να προσαρμόσουν τα χρώματα από μόνα τους, όπως η έξοδος ενός ελαφρώς διαφορετικού κόκκινου, εάν ο πράκτορας χρήστη είναι ανίκανος να αποδώσει ένα συγκεκριμένο εξάγωνο λόγω της ποιότητας της οθόνης κάποιου άλλου παράγοντα. Η ιδιοκτησία λέει αποτελεσματικά στο πρόγραμμα περιήγησης, "Γεια, θα ήθελα να χρησιμοποιήσετε αυτό το χρώμα, αλλά είναι ωραίο αν δεν μπορείτε και θέλετε να εφαρμόσετε την καλύτερη εναλλακτική λύση για την κατάσταση." Ή, αντιστρόφως, μπορεί να καθοδηγήσει το πρόγραμμα περιήγησης να ταιριάζει ακριβώς με το χρώμα με κάθε κόστος.
Τυπωμένα στυλ
Αρκετά ενδιαφέρον, η προδιαγραφή χρησιμοποιεί το παράδειγμα εκτύπωσης ιστοσελίδων σε ολόκληρο τον ορισμό του color-adjust. Ωστόσο, δεν υπάρχει πραγματική τεκμηρίωση ότι προορίζεται για εκτύπωση. Αυτό δεν εμπόδισε το Chrome και το Safari να εφαρμόσουν μια προκαθορισμένη έκδοση που ονομάζεται webkit-print-color-adjust, η οποία αποτελεί ισχυρή ένδειξη ότι προορίζεται για σκοπούς εκτύπωσης.
Γιατί έχει σημασία; Οι προδιαγραφές περιγράφουν μια περίπτωση χρήσης όπου η διατήρηση της ζέβρας λωρίδας ενός στυλ πίνακα σε μια τυπωμένη σελίδα θα μπορούσε να βοηθήσει την αναγνωσιμότητα:
Για παράδειγμα, ένας ιστότοπος χαρτογράφησης που προσφέρει έντυπες οδηγίες μπορεί να "ζέβρα-λωρίδα" τα βήματα προς τις κατευθύνσεις, εναλλάσσοντας μεταξύ λευκού και ανοιχτού γκρι φόντου. Χάνοντας αυτό το ζέβρα και έχοντας ένα καθαρό λευκό φόντο θα έκανε τις οδηγίες πιο δύσκολο να διαβαστεί με μια γρήγορη ματιά όταν αποσπούν την προσοχή σε ένα αυτοκίνητο.
color-adjustέχει οριστεί σε economy.
Σύνταξη
.my-element ( color-adjust: (economy | exact); )Αξίες
economy(αρχική τιμή): Αυτή η τιμή επιτρέπει στο πρόγραμμα περιήγησης να κάνει προσαρμογές στο χρώμα και το στυλ ενός στοιχείου όπου αποφασίζει ότι πρέπει, είτε πρόκειται να βελτιώσει την αναγνωσιμότητα, να αντικαταστήσει ένα χρώμα που μια συσκευή δεν μπορεί να εμφανίσει ή κάποιο άλλο παράγοντα. Λάβετε υπόψη ότι αυτή είναι η προεπιλεγμένη τιμή και, ακόμη και αν η ιδιότητα δεν εφαρμόζεται, έτσι συμπεριφέρονται τα προγράμματα περιήγησης.exact: Αυτή η τιμή δίνει εντολή στο πρόγραμμα περιήγησης να ταιριάζει με ένα χρώμα με κάθε κόστος για να διατηρηθεί το δηλωμένο στυλ. Θα χρησιμοποιηθεί για να αναδείξει στυλ που είναι "σημαντικά" ή "σημαντικά" για το στοιχείο.
Λάβετε υπόψη ότι η προεπιλεγμένη χρήση του economyεάν η ιδιότητα καλείται ή όχι υποδηλώνει ότι color-adjustέχει σχεδιαστεί για να παρέχει ένα σήμα σε προγράμματα περιήγησης που υποδεικνύουν στυλ που είναι αρκετά σημαντικά για να διατηρηθούν.
Κατάσταση προδιαγραφών
Η color-adjustιδιότητα ορίζεται στο CSS Color Module Level 4, το οποίο βρίσκεται σε κατάσταση δημόσιας πρόχειρης εργασίας κατά τη στιγμή αυτής της γραφής. Αυτό σημαίνει ότι δεν έχει ακόμη εγκριθεί από το W3C και θα μπορούσε να ενημερωθεί, να αλλάξει ή ακόμη και να πέσει σε μεταγενέστερες αναθεωρήσεις. Ως εκ τούτου, αυτή η ιδιότητα δεν είναι έτοιμη για παραγωγή και θεωρείται πειραματική.
Υποστήριξη προγράμματος περιήγησης
Αυτά τα δεδομένα υποστήριξης του προγράμματος περιήγησης προέρχονται από την Caniuse, η οποία έχει περισσότερες λεπτομέρειες. Ένας αριθμός υποδεικνύει ότι το πρόγραμμα περιήγησης υποστηρίζει τη λειτουργία σε αυτήν την έκδοση και νεότερη.
Επιφάνεια εργασίας
| Χρώμιο | Firefox | ΙΕ | Ακρη | Σαφάρι |
|---|---|---|---|---|
| 19 * | 48 | Οχι | 79 * | 6 * |
Κινητό / Tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 14.0-14.4 |
Περισσότερες πληροφορίες
- CSS Color Module Level 4 First Public Working Draft
- Στατιστικά στοιχεία χρήσης του Microsoft Edge
- Τεκμηρίωση MDN
- Οι δυνατότητες της ιδιότητας προσαρμογής χρώματος