Υποενότητα 4.1 Επιλογείς

  • επιλογέας id 
  • επιλογέας κλάση (Class) και πολλαπλές κλάσεις 
  • επιλογή συγκεκριμένου περιεχομένου (ul li)
  • ομαδοποίηση επιλογέων 

Ομαδοποίηση επιλογέων

Ας υποθέσουμε ότι θέλουμε να εφαρμόσουμε το ίδιο στυλ σε διαφορετικά στοιχεία. Για παράδειγμα, θέλουμε όλα τα στοιχεία h3, h4 και p να ευθυγραμμιστούν στο κέντρο (centered aligned). Με αυτά που έχουμε μάθει, θα το κάνουμε ως εξής:

h3 { text-align: center;}
h4 { text-align: center;}
p { text-align: center;}

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

Κάνοντας αυτό ελαχιστοποιούμε τον κώδικα που πρέπει να γράψουμε.

Έτσι, τα παραπάνω μπορούν να γραφτούν ως:

h1, h3, p { text-align: center;}

 

Περισσότερες πληροφορίες για τους επιλογείς: https://www.w3schools.com/css/css_syntax.asp