Ζουμ - CSS-Κόλπα

Anonim

Η zoomιδιότητα στο CSS σάς επιτρέπει να κλιμακώσετε το περιεχόμενό σας. Είναι μη τυπικό και αρχικά εφαρμόστηκε μόνο στον Internet Explorer. Αν και πολλά άλλα προγράμματα περιήγησης υποστηρίζουν τώρα ζουμ, δεν συνιστάται για ιστότοπους παραγωγής.

.zoom ( zoom: 150%; )

Οι "υποστηριζόμενες: τιμές είναι:

  • percentage - Κλίμακα κατά αυτό το ποσοστό
  • number- Μετατροπή σε ποσοστό και κλίμακα - 1 == 100%; 1,5 == 150%;
  • normal - ζουμ: 1;

Εάν το πρόγραμμα περιήγησής σας το υποστηρίζει, θα δείτε αυτές τις εικόνες ως διαφορετικά μεγέθη:

Δείτε αυτό το στυλό!

Το Zoom είναι ένα παλιό IE. Δεν είναι κάτι που πρέπει να χρησιμοποιείτε σε ζωντανές τοποθεσίες. Εάν θέλετε να κλιμακώσετε το περιεχόμενο, χρησιμοποιήστε CSS Transforms. Μπορείτε επίσης να χρησιμοποιήσετε φίλτρα εάν χρειάζεστε υποστήριξη oldIE.

Πίσω στις μέρες του IE6, το zoom χρησιμοποιήθηκε κυρίως ως hack. Πολλά από τα σφάλματα απόδοσης τόσο στο IE6 όσο και στο IE7 θα μπορούσαν να διορθωθούν χρησιμοποιώντας ζουμ. Για παράδειγμα, display: inline-blockδεν λειτούργησε πολύ καλά στο IE6 / 7. Η ρύθμιση zoom: 1διόρθωσε το πρόβλημα. Το σφάλμα είχε να κάνει με τον τρόπο με τον οποίο ο IE απέδωσε τη διάταξή του. Η ρύθμιση zoom: 1ενεργοποίησε μια εσωτερική ιδιότητα που ονομάζεται hasLayout, η οποία διόρθωσε το πρόβλημα.

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

Χρώμιο Σαφάρι Firefox ΛΥΡΙΚΗ ΣΚΗΝΗ ΙΕ Android iOS
Οποιος 4.0+ Κανένας Κανένας 5.5+ TBD TBD

Safari υποστηρίζει, επίσης, zoomαπό την έκδοση 4. Ωστόσο, πρόσθεσε μια νέα τιμή: reset. Αυτό λέει στο πρόγραμμα περιήγησης να μην μεγεθύνει το στοιχείο σας στο ζουμ. Λοιπόν, το cmd / ctrl +; Δεν λειτουργεί σε στοιχεία με zoom: resetεφαρμοσμένα.