Βιβλίο
Υποενότητα 3.2: Εισαγωγή CSS
Υποενότητα 3.2: Εισαγωγή CSS
Απαιτήσεις ολοκλήρωσης
Προβολή
Πού εισάγουμε CSS:
- style attribute σε στοιχεία HTML – inline style
- Εσωτερικό - Internal Style Sheet
- Εξωτερικό αρχείο - External style sheet
Προτεραιότητα
Inline style
Τα εσωτερικά στυλ - Inline styles ορίζονται στο HTML body. Σε αυτή την περίπτωση, τοποθετούμε style
και τους κανόνες μας μέσα στο στοιχείο στο οποίο θέλουμε να μορφοποιήσουμε.
Παράδειγμα
Οι κανόνες CSS:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Style - CSS</title>
</head>
<body>
<h2>Inline style</h2>
<p>This is the default text</p>
<p style= "color:red;"> This text would appear read! </p>
<p style= "background-color: teal;"> This text has background color! </p>
<p style= "text-transform: capitalize;"> This first letter of each word is capitalized! </p>
<p style= "text-indent: 50px;"> This text has indent of 50px! </p>
<p style= "letter-spacing: 3px;"> This text has letter spacing of 50px! </p>
</body>
</html>
θα δημιουργήσουν μια σελίδα που εμφανίζεται ως:
To ιnline style χρησιμοποιείται όταν θέλουμε να εφαρμόσουμε ένα μοναδικό στυλ σε ένα συγκεκριμένο στοιχείο του html μας.
Styling σε κείμενο
Κοινές ιδιότητες για μορφοποίηση κειμένουείναι:
- χρώμα για το κείμενο color
- χρώμα για το υπόβαθρο background-color
- γραμματοσειρά font‐family
- μέγεθος γραμμάτων font‐size
- στοίχιση κειμένου text‐align
Περισσότερες πληροφορίες: https://www.w3schools.com/css/css_text.asp