Σύνταξη CSS

Πίνακας περιεχομένων

    Εμφάνιση πίνακα περιεχομένων

Ένας κανόνας CSS αποτελείται από έναν επιλογέα και ένα μπλοκ δήλωσης.

Σύνταξη CSS

Ο επιλογέας δείχνει το στοιχείο HTML που θέλετε να διαμορφώσετε.

Το μπλοκ δηλώσεων περιέχει μία ή περισσότερες δηλώσεις που χωρίζονται με ερωτηματικά.

Κάθε δήλωση περιλαμβάνει ένα όνομα ιδιότητας CSS και μια τιμή, που χωρίζονται με άνω και κάτω τελεία.

Πολλαπλές δηλώσεις CSS χωρίζονται με ερωτηματικά και δήλωση τα μπλοκ περιβάλλονται από σγουρά τιράντες.

Παράδειγμα

Σε αυτό το παράδειγμα όλα τα στοιχεία <p> θα είναι στοίχιση στο κέντρο, με ένα κόκκινο χρώμα κειμένου:

p
{
  color: red;
  text-align: center;
}

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<head>
<style>
p {
  color: red;
  text-align: center;
} 
</style>
</head>
<body>

<p>Hello World!</p>
<p>These paragraphs are styled with CSS.</p>

</body>
</html>

Παράδειγμα Επεξήγηση

  • Το p είναι ένας επιλογέας στο CSS (δείχνει το στοιχείο HTML που θέλετε να δημιουργήσετε στυλ: <p>).

  • Το color είναι μια ιδιότητα και το red είναι η τιμή της ιδιότητας

  • Το text-align είναι μια ιδιότητα και το κέντρο είναι η τιμή ιδιότητας

Θα μάθετε πολλά περισσότερα για τους επιλογείς CSS και τις ιδιότητες CSS στα επόμενα κεφάλαια!