Αναγνωριστικό - CSS-Κόλπα

Ο #idεπιλογέας σάς επιτρέπει να στοχεύσετε ένα στοιχείο με αναφορά στο idχαρακτηριστικό HTML. Παρόμοια με τον τρόπο με τον οποίο χαρακτηρίζονται τα χαρακτηριστικά κλάσης στο CSS με μια "τελεία" ( .) πριν από το όνομα της τάξης, τα χαρακτηριστικά αναγνωριστικού προτίθενται με ένα "οκτόθορ" ( #), πιο γνωστό ως "hash" ή "pound pound".

#header ( /* this is the ID selector */ background: #eee; )

Οι τιμές χαρακτηριστικών ID πρέπει να είναι μοναδικές. Η HTML με δύο ή περισσότερα πανομοιότυπα idδεν επικυρώνει και θα παράγει απρόβλεπτα αποτελέσματα. Εάν υπάρχουν δύο από τα ίδια, το CSS θα ταιριάζει και θα ταιριάζει και στα δύο. Ωστόσο, όταν κάνετε ερώτηση για ένα αναγνωριστικό, θα βρείτε το πρώτο και θα σταματήσει.

Οι επιλογείς ταυτότητας είναι εξαιρετικά ισχυροί. Έχουν πολύ υψηλή ειδικότητα, γενικά γραμμένη ως (0, 1, 0, 0). Τα στυλ που ισχύουν, αντικαθιστούν άλλους επιλογείς που χρησιμοποιούν μόνο ετικέτες ή τάξεις. Για να δείξετε:

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

Μια παράγραφος με ταυτότητα και χαρακτηριστικό κλάσης δίνεται σε αντίθεση με τους κανόνες CSS. παρόλο που ο επιλογέας τάξης ( .reusable) βρίσκεται κάτω από τον επιλογέα αναγνωριστικών ( #unique) στο CSS (γενικά παρακάμπτει τα στυλ πάνω από το "cascade"), η παράγραφος παραμένει κόκκινη επειδή #uniqueκατακλύζει το μπλε χρώμα που ορίζεται από .reusable. Ένα άπειρο ποσό τάξεων δεν μπορεί ποτέ να ξεπεράσει την ιδιαιτερότητα του αναγνωριστικού (αν και υπήρχε ένα σφάλμα ταυτόχρονα όπου 256 τάξεις θα κέρδιζαν ένα αναγνωριστικό).

Η υψηλή εξειδίκευση και η μοναδικότητα σημαίνει ότι η χρήση #idείναι μια "πυρηνική επιλογή" CSS: υπερδύναμη, άκαμπτη και δυσανάλογα αποτελεσματική. Η αποφυγή του #idεπιλογέα στο CSS θεωρείται βέλτιστη πρακτική: είναι προτιμότερο να χρησιμοποιείτε μια τάξη σε σχεδόν κάθε περίπτωση.

Τούτου λεχθέντος, τα χαρακτηριστικά ID έχουν πολλές πολύτιμες χρήσεις εκτός του CSS:

Παροχή μοναδικών αγκιστριών για JavaScript
Τα στοιχεία με idχαρακτηριστικά μπορούν να στοχεύονται με ετικέτες αγκύρωσης, ορίζοντας το hrefχαρακτηριστικό στην idτιμή, προθεματισμένο από ένα #σύμβολο. Κάνοντας κλικ σε αυτόν τον σύνδεσμο αγκύρωσης θα επικεντρωθεί εκ νέου η τρέχουσα σελίδα στο στοιχείο με την αντιστοίχιση id. Αυτό ονομάζεται "αναγνωριστικό θραύσματος".
Για πραγματικά μοναδικά στοιχεία στο HTML σας, όπως στοιχεία φόρμας, τα αναγνωριστικά θα μπορούσαν να είναι χρήσιμα για πράγματα όπως η σύνδεση labels και inputs.

Σημεία ενδιαφέροντος

Ένα έγκυρο #idδεν μπορεί να ξεκινά με έναν αριθμό και πρέπει να έχει τουλάχιστον έναν χαρακτήρα. Ένα μεγάλο μέρος του Unicode είναι έγκυροι χαρακτήρες σε ένα id.
id Τα χαρακτηριστικά και οι επιλογείς είναι διάκριση πεζών-κεφαλαίων και πρέπει να αντιστοιχούν ακριβώς σε HTML, CSS και JavaScript