1Κεφάλαιο 4 Κανόνες Σύνταξης HTML Όλες οι ετικέτες εσωκλείονται μεταξύ των χαρακτήρων “ “. Κάθε τι που βρίσκεται μεταξύ των χαρακτήρων “ ”, αποτελεί σχόλιο. Έχουμε δυο ειδών ετικέτες, τις απλές ετικέτες της μορφής και τις διπλές ετικέτες, της μορφής …. Η ετικέτα τέλους ακυρώνει την ισχύ της πρώτης και πάντα περιέχει το χαρακτήρα “/”.
2Κεφάλαιο 4 Κανόνες Σύνταξης HTML Ορισμένες ετικέτες μπορεί να ακολουθούνται από παραμέτρους οι οποίες διευκρινίζουν τη λειτουργία της ετικέτας. Οι ετικέτες μπορεί να γράφονται και με πεζά και κεφαλαία. Κενές γραμμές, καθώς και περισσότερα του ενός κενά μεταξύ των λέξεων, στο κείμενο που περιλαμβάνει μια ιστοσελίδα δε λαμβάνονται υπόψη.
3Κεφάλαιο 4 ΔΟΜΗ ΕΓΓΡΑΦΟΥ HTML Κάθε σελίδα HTML αρχίζει με την ετικέτα και τελειώνει με. Η επικεφαλίδα ορίζεται μέσα στη διπλή ετικέτα και, ενώ το κυρίως σώμα της σελίδας ορίζεται μέσα στη διπλή ετικέτα και. Η επικεφαλίδα συνήθως περιγράφει το περιεχόμενο της σελίδας. Ο τίτλος της σελίδας ο οποίος εμφανίζεται στο πάνω μέρος του browser περιέχεται στην επικεφαλίδα και μέσα στη διπλή ετικέτα …
Κεφάλαιο 4 4 ΔΟΜΗ ΕΓΓΡΑΦΟΥ HTML Ο τίτλος που θέλουμε να εμφανιστεί στην μπάρα του παραθύρου Από εδώ και κάτω είναι το κυρίως σώμα της ιστοσελίδας μας
5Κεφάλαιο 4
6 ΠΑΡΟΥΣΙΑΣΗ ΚΑΙ ΜΟΡΦΟΠΟΙΗΣΗ ΚΕΙΜΕΝΟΥ Αλλαγή Γραμμής Αλλαγή Παραγράφου … Έντονη γραφή … Πλάγια γραφή … Υπογράμμιση …, i=1…6 Επικεφαλίδες με μέγεθος I με μεγαλύτερο το 1
7Κεφάλαιο 4
8
9 ΠΑΡΟΥΣΙΑΣΗ ΚΑΙ ΜΟΡΦΟΠΟΙΗΣΗ ΚΕΙΜΕΝΟΥ … Χαρακτήρες μικρού μεγέθους … Χαρακτήρες μεγάλου μεγέθους … Έντονη γραφή … Δείκτης … Εκθέτης … Αντίγραφο της μορφής που είναι γραμμένη στον συντάκτη, αφήνει μια γραμμή κενό πριν και μετά Οριζόντια γραμμή και αυτόματη αλλαγή γραμμής
10Κεφάλαιο 4
11Κεφάλαιο 4
12Κεφάλαιο 4 ΠΑΡΟΥΣΙΑΣΗ ΚΑΙ ΜΟΡΦΟΠΟΙΗΣΗ ΚΕΙΜΕΝΟΥ … Κεντράρισμα στο κέντρο της οθόνης Για στοίχιση παραγράφου Καθορίζει το βασικό μέγεθος του κειμένου Αλλαγή μεγέθους του κειμένου … Διακριτή διαγραφή
13Κεφάλαιο 4
14Κεφάλαιο 4
15Κεφάλαιο 4 Άσκηση 1 Δημιουργήστε την παρακάτω ιστοσελίδα με την χρήση των ετικετών που έχετε μάθει. Ο τίτλος είναι επικεφαλίδα μεγέθους 1 Το βασικό μέγεθος κειμένου είναι 4 Οι όροι HyperText Markup Language είναι μεγαλύτεροι κατά 1 Το Καλή συνέχεια... είναι μεγαλύτερο κατά 3
16Κεφάλαιο 4
17Κεφάλαιο 4 Υπόβαθρο γραμματοσειράς και χρώμα κειμένου Η δήλωση του χρώματος του υποβάθρου, καθώς και του χρώματος του κειμένου γίνεται με την χρήση ειδικών παραμέτρων, οι οποίες μπορούν να ενσωματωθούν στη διπλή ετικέτα …. Οι παράμετροι αυτές είναι οι BGColor = “χρώμα υποβάθρου” και Text = “χρώμα κειμένου”, για τη δήλωση του χρώματος υποβάθρου και κειμένου αντίστοιχα. Ενσωματώνονται στην ετικέτα ως εξής :
18Κεφάλαιο 4
19Κεφάλαιο 4
20Κεφάλαιο 4 Κατάλογοι Αριθμητικοί κατάλογοι Είναι αυτοί που παρουσιάζουν τα στοιχεία του καταλόγου κατά αύξουσα αριθμητική σειρά. Για τη δημιουργία ενός αριθμητικού καταλόγου με την HTML, χρησιμοποιούμε την παρακάτω δομή ετικετών : Στοιχείο 1 Στοιχείο 2 Στοιχείο 3
21Κεφάλαιο 4 Κατάλογοι Στην ετικέτα έναρξης του αριθμητικού καταλόγου μπορούμε να χρησιμοποιήσουμε δυο παραμέτρους Η παράμετρος type δηλώνει το είδος της αριθμητικής λίστας και η παράμετρος start δηλώνει την τιμή έναρξης αρίθμησης.
22Κεφάλαιο 4
23Κεφάλαιο 4 Κατάλογοι Μη ταξινομημένοι ή μη αριθμητικοί κατάλογοι Οι κατάλογοι αυτοί χρησιμοποιούνται για τη παρουσίαση των στοιχείων τους, χωρίς αυτά να είναι ταξινομημένα σε κάποια ιδιαίτερη σειρά. Στοιχείο 1 Στοιχείο 2 Στοιχείο 3
24Κεφάλαιο 4 Κατάλογοι Στην ετικέτα έναρξης του μη αριθμητικού καταλόγου ή στην ετικέτα στοιχείου καταλόγου μπορούμε να χρησιμοποιήσουμε την παράμετρο type, ως εξής : ή Και δηλώνει το είδος του συμβόλου που θα τοποθετηθεί μπροστά από τα στοιχεία της λίστας
25Κεφάλαιο 4
26Κεφάλαιο 4 Ένθετες λίστες Οι αριθμημένες και οι μη αριθμημένες λίστες, μπορούν να έχουν διαφορετικά επίπεδα. Η κάθε μία, μπορεί να κάνει υποεπίπεδα μέσα στη λίστα, με άλλες λίστες (βλέπε παράδειγμα). Το μείζων θέμα είναι η επαλήθευση της κάθε λίστας ώστε να τελειώνει σωστά και να είναι σωστή η ένωση. Μπορείτε να ξεκινήσετε με μια πολύπλοκη ματιά με αυτές τις ετικέτες, αλλά θυμηθείτε τη βασική δομή:
27Κεφάλαιο 4
28Κεφάλαιο 4
29Κεφάλαιο 4 Ένθετες λίστες -- μεταξύ των δύο Δεν μπορείτε μόνο να περιλαμβάνετε αριθμημένες με αριθμημένες, αλλά και τους δύο τύπους ταυτόχρονα.
30Κεφάλαιο 4
31Κεφάλαιο 4
32Κεφάλαιο 4 Άσκηση 2 Δημιουργήστε την παρακάτω ιστοσελίδα με την χρήση των ετικετών που έχετε μάθει: Χρώμα υποβάθρου πράσινο Χρώμα γραμματοσειράς κίτρινο ( η λέξη παράδειγμα να είναι άσπρη) Χρησιμοποιείστε τις γραμματοσειρές Times New Roman, Tahoma και Comic Sans MS
33Κεφάλαιο 4