Αναφορά Μονάδων CSS

Όλα τα εργαλεία Δωρεάν

Περιηγηθείτε σε κάθε μονάδα CSS — απόλυτες (px, cm, pt), σχετικές με τη γραμματοσειρά (em, rem, ch), viewport (vw, dvh), container-query, grid (fr), γωνίας, χρόνου και ανάλυσης — σε μια αναζητήσιμη, φιλτραριζόμενη κατά τύπο αναφορά με περιγραφή, σημείωση «πότε να χρησιμοποιείτε» και έτοιμα προς αντιγραφή tokens. Στον περιηγητή σας, δωρεάν.

Κάθε μονάδα CSS, εξηγημένη. Όλα εκτελούνται στο πρόγραμμα περιήγησής σας από ενσωματωμένη αναφορά — τίποτα δεν αποστέλλεται στον διακομιστή.

Καμία μονάδα δεν ταιριάζει με την αναζήτησή σας.
Δοκιμάστε διαφορετική μονάδα ή κατηγορία — για παράδειγμα rem, dvh, fr ή γωνία.

Σχετικά με το Αναφορά Μονάδων CSS

Η Αναφορά Μονάδων CSS τεκμηριώνει κάθε μονάδα που προσφέρει η γλώσσα — 45 συνολικά — οργανωμένες ανά τύπο: απόλυτες μονάδες όπως px, cm και pt· μονάδες σχετικές με γραμματοσειρά όπως em, rem, ch και lh· μονάδες viewport από vw και vh έως τις νεότερες svh, lvh και dvh· μονάδες container-query όπως cqw και cqi· τη μονάδα πλέγματος fr· συν γωνία, χρόνο, ανάλυση και ποσοστό.

Κάθε κάρτα δίνει περισσότερα από έναν ορισμό: το token της μονάδας σε αντιγράψιμη monospace γραμματοσειρά, το πλήρες όνομά της, την κατηγορία της, μια απλή περιγραφή του πώς υπολογίζεται, και μια πρακτική σημείωση «πότε να τη χρησιμοποιήσετε» που λέει πού κερδίζει η μονάδα τη θέση της — και πού μια διαφορετική εξυπηρετεί καλύτερα.

Η αναζήτηση ταιριάζει tokens, ονόματα και σημασίες, οπότε rem, viewport width και root βρίσκουν όλα τις μονάδες τους, και ετικέτες τύπου φιλτράρουν το πλέγμα σε μία οικογένεια. Όλα εκτελούνται στο πρόγραμμα περιήγησής σας από μια ενσωματωμένη αναφορά, χωρίς τίποτα να στέλνεται σε διακομιστή.

Πώς να χρησιμοποιήσετε το Αναφορά Μονάδων CSS

  1. Αναζητήστε μια μονάδα με token, όνομα ή σημασία — για παράδειγμα rem, viewport width ή angle.
  2. Χρησιμοποιήστε τις ετικέτες τύπου για να φιλτράρετε το πλέγμα σε απόλυτες, γραμματοσειράς, viewport, container, πλέγματος, γωνίας, χρόνου, ανάλυσης ή ποσοστού μονάδες.
  3. Διαβάστε την περιγραφή κάθε μονάδας και τη σημείωση «πότε να τη χρησιμοποιήσετε» για να επιλέξετε τη σωστή.
  4. Κάντε κλικ στο κουμπί αντιγραφής για να πάρετε το token της μονάδας για το stylesheet σας.

Συχνές ερωτήσεις

Χρησιμοποιήστε rem για μεγέθη γραμματοσειράς και οτιδήποτε πρέπει να κλιμακώνεται με το προτιμώμενο μέγεθος κειμένου του χρήστη — το rem παρακολουθεί το μέγεθος γραμματοσειράς της ρίζας, οπότε λειτουργούν οι ρυθμίσεις προσβασιμότητας του προγράμματος περιήγησης. Χρησιμοποιήστε px για πράγματα που πρέπει να παραμείνουν οπτικά σταθερά, όπως λεπτά περιγράμματα.

Το em είναι σχετικό με το μέγεθος γραμματοσειράς του ίδιου του τρέχοντος στοιχείου, οπότε τα εμφωλευμένα στοιχεία σωρεύουν την τιμή· το rem είναι πάντα σχετικό με το ριζικό στοιχείο, δίνοντας προβλέψιμα αποτελέσματα. Γι' αυτό το rem έχει γίνει η προεπιλεγμένη επιλογή για κλίμακες απόστασης και τύπου.

Τα προγράμματα περιήγησης κινητών εμφανίζουν και αποκρύπτουν τις γραμμές εργαλείων τους, αλλάζοντας το ορατό ύψος, ενώ το vh παραμένει σταθερό στο μεγαλύτερο μέγεθος διάταξης. Η δυναμική μονάδα dvh παρακολουθεί το πραγματικό ορατό ύψος καθώς κινούνται οι γραμμές εργαλείων, και οι svh/lvh καρφώνονται στις μικρότερες και μεγαλύτερες καταστάσεις.

Το fr κατανέμει τον ελεύθερο χώρο ενός container πλέγματος κατά κλάσμα: grid-template-columns: 2fr 1fr δίνει στην πρώτη στήλη διπλάσιο εναπομείναν πλάτος από τη δεύτερη, αφού αφαιρεθούν σταθερά tracks και κενά. Υπάρχει μόνο μέσα σε ορισμούς track πλέγματος.

Προσαρμόζουν το μέγεθος στοιχείων σχετικά με τον πλησιέστερο container ερωτήματος αντί για το viewport: το cqw είναι 1% του πλάτους του container, το cqi 1% του inline μεγέθους του. Επιτρέπουν σε ένα component να κλιμακώνεται στο κουτί όπου ζει, ανεξάρτητα από το μέγεθος οθόνης.

Ναι. Όλες οι 45 μονάδες τεκμηριώνονται δωρεάν σε μια σελίδα που εκτελείται εξ ολοκλήρου στο πρόγραμμα περιήγησής σας — χωρίς εγγραφή, χωρίς αιτήματα στον διακομιστή.
Κοινοποίηση
Σχετικά Εργαλεία
Κωδικοί Κατάστασης HTTP Αναζητήστε κάθε κωδικό κατάστασης απόκρισης HTTP (1xx–5xx) σε έναν αναζητήσιμο, φιλτραριζόμενο κατάλογο — και ανοίξτε οποιονδήποτε κωδικό για να δείτε τι σημαίνει, πότε να τον χρησιμοποιείτε, αν είναι cacheable και το RFC που τον ορίζει. Στον περιηγητή σας, δωρεάν. Δωρεάν
Μέθοδοι HTTP Μια εύχρηστη αναφορά για κάθε μέθοδο αιτήματος HTTP — GET, POST, PUT, PATCH, DELETE και τις υπόλοιπες, καθώς και WebDAV — που δείχνει με μια ματιά αν καθεμία είναι ασφαλής, ταυτοδύναμη (idempotent) και cacheable, αν δέχεται σώμα, και ένα τυπικό παράδειγμα. Στον περιηγητή σας, δωρεάν. Δωρεάν
Αναφορά Κεφαλίδων HTTP Αναζητήστε κοινές κεφαλίδες αιτήματος και απόκρισης HTTP σε έναν αναζητήσιμο κατάλογο — φιλτράρετε κατά κατεύθυνση και κατηγορία, διαβάστε μια σύντομη περιγραφή και ένα ρεαλιστικό παράδειγμα, και αντιγράψτε οποιοδήποτε όνομα κεφαλίδας με ένα κλικ. Στον περιηγητή σας, δωρεάν. Δωρεάν
Τύποι Εγγραφών DNS Περιηγηθείτε σε κάθε κοινό τύπο εγγραφής DNS — A, AAAA, CNAME, MX, TXT, NS, SOA, PTR, SRV, CAA, DNSKEY, DS, TLSA και άλλους — με τον σκοπό του, ένα αντιγράψιμο παράδειγμα zone-file και μια κατηγορία. Αναζητήστε και φιλτράρετε άμεσα, στον περιηγητή σας, δωρεάν. Δωρεάν
Αριθμοί Θυρών TCP/UDP Αναζητήστε γνωστές και συχνά χρησιμοποιούμενες θύρες δικτύου σε έναν αναζητήσιμο πίνακα — FTP, SSH, HTTP, HTTPS, MySQL, Postgres, RDP, Redis, MongoDB και 120+ ακόμη, καθεμία με το πρωτόκολλο μεταφοράς, την υπηρεσία, την περιγραφή και την κατηγορία της. Αναζητήστε κατά αριθμό θύρας ή όνομα υπηρεσίας και αντιγράψτε τιμές άμεσα. Στον περιηγητή σας, δωρεάν. Δωρεάν
Υπολογιστής Subnet / CIDR Υπολογίστε υποδίκτυα IPv4 από CIDR ή μάσκα: δίκτυο, εκπομπή, εύρος host, μπαλαντέρ και άλλα. Δωρεάν
Χρειάζεστε βοήθεια;
Βρήκατε πρόβλημα με αυτό το εργαλείο; Ενημερώστε μας.
Αναφορά προβλήματος

Προσθέστε αυτό το δωρεάν εργαλείο στον δικό σας ιστότοπο — αντιγράψτε και επικολλήστε τον παρακάτω κώδικα.