Τύπος - CSS-Κόλπα | CSS Almanac 2025

Ένας επιλογέας τύπων (μερικές φορές αναφέρεται ως επιλογέας τύπων στοιχείων) ταιριάζει με τα στοιχεία με το αντίστοιχο όνομα κόμβου στοιχείων, όπως

, και ετικέτες. Οι επιλογείς τύπου χρησιμοποιούνται γενικά για να κάνουν αλλαγές ευρείας διαδρομής στο στυλ ενός ιστότοπου.

p ( /* "p" is the type selector */ margin: 0 0 1em 0; )

Κοινή χρήση

Συχνά οι φορές οι Επιλογείς τύπου ορίζονται ως προεπιλογές, όπως σε μια επαναφορά CSS όπου η πρόθεση είναι να παρακάμψετε τις προεπιλογές του προγράμματος περιήγησης. Ένα παράδειγμα από την πρώτη γραμμή του normalize.css, μια δημοφιλή επαναφορά CSS:

article, aside, details, figcaption, figure, footer, header, main, nav, section, summary ( display: block; )

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

Βέλτιστες πρακτικές

Γενικά θεωρείται κακή πρακτική η εφαρμογή αλλαγών λεπτομερών λεπτομερειών μόνο με έναν επιλογέα τύπου. Για παράδειγμα, η εφαρμογή μιας ιδιότητας "color: white" σε όλες τις ετικέτες σπάνια θα ήταν κάτι χρήσιμο σε οποιονδήποτε ιστότοπο. Αυτό συμβαίνει επειδή οι ετικέτες είναι γενικές και χρησιμοποιούνται σε όλους τους ιστότοπους για διάφορους σκοπούς.

Ωστόσο, με έναν επιλογέα τύπου όπως body ( ), ορίζοντας μια προεπιλογή font-size και line-heightείναι κοινό. Αυτό οφείλεται εν μέρει στο γεγονός ότι μπορεί να υπάρχει μόνο μία ετικέτα σε οποιαδήποτε δεδομένη σελίδα, οπότε υπάρχουν λιγότερες ευκαιρίες για διενέξεις.

Τύπος επιλογής και απόδοση

Οι επιλογείς τύπου βρίσκονται στο χαμηλότερο επίπεδο του καταρράκτη εξειδίκευσης (γενικά γραμμένο ως 0, 0, 0, 1), πράγμα που σημαίνει ότι σχεδόν οτιδήποτε θα αντικαταστήσει το στυλ που εφαρμόζεται μόνο μέσω ενός επιλογέα τύπου και προσθέτει έναν επιλογέα τύπου σε μια κλάση ή αναγνωριστικό το CSS σας παρέχει ελάχιστη επιπλέον ιδιαιτερότητα.

Οι Επιλογείς τύπου κατατάσσονται επίσης χαμηλότερα στην κλίμακα απόδοσης CSS από ό, τι οι κλάσεις και τα αναγνωριστικά. Επομένως, είναι τεχνικά καλύτερη επιλογή απόδοσης να χρησιμοποιήσετε μια κλάση ή ένα αναγνωριστικό παρά τον πιο γενικό επιλογέα τύπου (αν και η πραγματική διαφορά ταχύτητας είναι συνήθως αμελητέα).