Διαφορά μεταξύ κατηγορίας και ταυτότητας

Anonim

Class vs ID

Το Cascading Style Sheets (CSS) είναι μια γλώσσα που περιγράφει την εμφάνιση και μορφοποίηση ενός εγγράφου που γράφεται χρησιμοποιώντας μια γλώσσα σήμανσης. Το CSS χρησιμοποιείται ευρέως για να σχεδιάσει ιστοσελίδες γραμμένες σε HTML. Το CSS επιτρέπει τον καθορισμό των επιλογών στυλ σας εκτός από την εφαρμογή στυλ για στοιχεία HTML. Αυτό γίνεται χρησιμοποιώντας τους επιλογείς ταυτότητας και κλάσης. Όταν καθορίζετε ένα στυλ για ένα μοναδικό στοιχείο, χρησιμοποιείται ο επιλογέας ταυτότητας. Όταν καθορίζετε ένα στυλ για μια ομάδα στοιχείων, χρησιμοποιείται ο επιλογέας κλάσης.

Τι είναι μια κατηγορία;

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

. my_class {

χρώμα: μπλε;

γραμματοσειράς: έντονη;

Η HTML μπορεί να αναφέρεται στην κλάση που ορίζεται στο CSS χρησιμοποιώντας την κλάση χαρακτηριστικών όπως φαίνεται παρακάτω.

Αυτή είναι η μορφοποίηση μου

Αυτή είναι η μορφοποίηση μου ξανά

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

Αυτή είναι η μορφοποίηση μου χρησιμοποιώντας δύο κατηγορίες

Τι είναι το αναγνωριστικό;

Στο CSS, ο επιλογέας ταυτότητας μπορεί να χρησιμοποιηθεί για να εφαρμόσει το δικό σας στυλ σε ένα μοναδικό στοιχείο. Στο CSS, ένας επιλογέας ταυτότητας αναγνωρίζεται από ένα hash (#). Ακολουθεί ένα παράδειγμα ενός επιλογέα αναγνωριστικού που ορίζεται στο CSS.

#my_ID {

χρώμα: κόκκινο;

κείμενο-ευθυγράμμιση: δεξιά;

}

Η HTML μπορεί να παραπέμπει στον επιλογέα ταυτότητας που ορίζεται στο CSS χρησιμοποιώντας το αναγνωριστικό χαρακτηριστικών όπως φαίνεται παρακάτω.

Αυτή είναι η φόρμα μου μορφοποίησης ένας επιλογέας ταυτότητας

Τα αναγνωριστικά είναι μοναδικά. Επομένως, κάθε στοιχείο μπορεί να έχει μόνο ένα μοναδικό αναγνωριστικό και κάθε σελίδα μπορεί να έχει μόνο ένα στοιχείο με αυτό το συγκεκριμένο αναγνωριστικό. Τα αναγνωριστικά έχουν ένα σημαντικό χαρακτηριστικό που μπορεί να χρησιμοποιηθεί με ένα πρόγραμμα περιήγησης. Εάν η διεύθυνση URL της σελίδας περιέχει μια τιμή κατακερματισμού (π.χ. // myweb. Com # my_id), το πρόγραμμα περιήγησης θα προσπαθήσει να εντοπίσει αυτόματα το στοιχείο με το αναγνωριστικό "my_id" και να μεταβεί στην ιστοσελίδα για να εμφανίσει το συγκεκριμένο στοιχείο. Αυτός είναι ένας λόγος για τον οποίο η σελίδα πρέπει να έχει ένα μόνο στοιχείο με αυτό το συγκεκριμένο αναγνωριστικό, έτσι ώστε το πρόγραμμα περιήγησης να εντοπίσει αυτό το στοιχείο.

Ποια είναι η διαφορά μεταξύ Κατηγορίας και αναγνωριστικού;

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