Book
Υποενότητα 3.2: Εισαγωγή CSS
Υποενότητα 3.2: Εισαγωγή CSS
Completion requirements
View
Πού εισάγουμε CSS:
- style attribute σε στοιχεία HTML – inline style
- Εσωτερικό - Internal Style Sheet
- Εξωτερικό αρχείο - External style sheet
Προτεραιότητα
Internal Style Sheet
Τα εσωτερικά στυλ - Internal styles καθορίζονται στην περιοχή the <head>
του εγγράφου HTML μέσα στην ετικέτα(tag) <style>
.
Παράδειγμα
Οι κανόνες CSS:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Style - CSS</title>
<style>
h2 {
font-family: "Times New Roman", Times, serif;
font-style: italic;
}
h4 {
font-family: "Verdana", Sans-serif;
font-variant: small-caps;
}
p {
font-family: "Lucida", Monospace;
font-size: 1.1em;
}
</style>
</head>
<body>
<h2>This is a Heading 2</h2>
<h4>This is a Heading 4</h4>
<p>This is lorem ipsum paragraph: <br>
Lorem ipsum dolor sit amet, ea nec probo eloquentiam, in esse quando laboramus sea. <br>
Ne omnesque detraxit eam, cu qui movet affert volutpat. <br>
Qui amet option eu. Utamur euismod hendrerit vel no, ius natum salutatus forensibus in. <br>
Sea diceret vivendo constituam at, duo an adhuc viderer evertitur.
</p>
</body>
</html>
θα δημιουργήσουν μια σελίδα που εμφανίζεται ως:
Το Internal style sheet μπορεί να χρησιμοποιηθεί όταν έχουμε μόνο μία σελίδα HTML ή όταν έχουμε πολλές σελίδες HTML αλλά θέλουμε ειδικούς κανόνες για τη συγκεκριμένη σελίδα HTML.
Περισσότερες πληροφορίες: https://www.w3schools.com/css/css_font.asp