class vs id selectors στο CSS

Ας μάθουμε πως να κάνουμε τις σελίδες μας με στιλ. Τα Cascading Style Sheets είναι ο τρόπος για να το επιτύχουμε.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
alou
Script Master
Δημοσιεύσεις: 1374
Εγγραφή: 24 Αύγ 2007 19:52
Επικοινωνία:

class vs id selectors στο CSS

Δημοσίευση από alou » 12 Δεκ 2012 17:37

Αποφάσισα να ρίξω μια ματιά στο CSSLint, από περιέργεια.

Έριξα μέσα ένα κομμάτι CSS από κάποιο site και περίμενα να δω τα συμπεράσματα που θα βγάλει... κάποια πολύ λογικά και μάλλον σωστά σαν warnings (dissalow !important), κάποια μάλλον όχι (disallow dublicate background images... sprites anybody?) και κάποιο που με κούφανε αρχικά:

Disallow IDs in selectors! WTF?!
Αφού το διάβασα αρκετές φορές να είμαι σίγουρος ότι δεν είναι η φαντασία μου, είπα να ψάξω λίγο παραπάνω να δω με ποια λογική μπορεί να προτείνεται κάτι τέτοιο.

Έπεσα σε ένα άρθρο του Oli Studholme, που περιληπτικά λέει ότι δεν υπάρχει λόγος να προτιμάς τα IDs στο CSS, ίσα ίσα με την εκτεταμένη χρήση της js ίσως είναι καλύτερο τα ids να τα αφήνεις μόνο για εκεί και να μην ανησυχείς μελλοντικά ότι οι αλλαγές look & feel θα σπάσουν js functions.

Επίσης, κάτι που δεν ήξερα και έχει ενδιαφέρον (αλλά μικρή πρακτική αξία) είναι ότι ο browser, διαβάζει ανάποδα τον selector στο css.

Δηλαδή, ενώ θεωρητικά ένα element είναι πιο γρήγορο να το βρεις με βάση το id του (που είναι και μοναδικό), όταν προεκτείνεται με άλλο στοιχείο γίνεται πιο αργό, πχ

#element -> γρήγορο
.element -> λίγο πιο αργό
#element a -> αρκετά πιο αργό γιατί τσεκάρει όλα τα a αν έχουν parent #element και ξανα μανά

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

Απάντηση

Επιστροφή στο “CSS - Cascading Style Sheets”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες