Υποενότητα 1.3: Απλό αρχείο HTML
Υποενότητα 1.3: Απλό αρχείο HTML
- Απλή HTML σελίδα
- Επικεφαλίδες - Headings και παράγραφοι - paragraphs
- Μορφοποίηση κειμένου- Text formatting
- Τύποι αλλαγής γραμμής - break
Απλή HTML σελίδα
Κάθε σελίδα HTML περιέχει ορισμένα βασικά στοιχεία-elements που είναι απαραίτητα για τη δομή της..
Αυτά είναι:<html>, <head>, <title> and <body>
Σχεδόν όλα τα στοιχεία HTML έχουν μια ετικέτα έναρξης και μια τελική ετικέτα-tag. Οι εξαιρέσεις θα συζητηθούν αργότερα στο μάθημα. Η βασική δομή μιας σελίδας HTML είναι:
Η πρώτη δήλωση που υπάρχει σε οποιαδήποτε σελίδα HTML είναι η <!DOCTYPE html>
. Αυτή η δήλωση πρέπει να εμφανίζεται μόνο μία φορά, στην αρχή του εγγράφου -document μας και αντιπροσωπεύει τον τύπο εγγράφου. Όταν δηλώνουμε τον τύπο εγγράφου, βοηθάμε τα προγράμματα περιήγησης - browsers να εμφανίζουν σωστά το περιεχόμενο της ιστοσελίδας μας.
Μετά το <!DOCTYPE html
ακολουθεί η <html>
tag. Κάθε HTML document αρχίζει με <html
και τελειώνει με </html>
. Αυτή η ετικέτα είναι η ρίζα- root του εγγράφου μας και είναι επίσης ο τόπος όπου δηλώνουμε τη γλώσσα του εγγράφου μας. Για παράδειγμα, εάν το περιεχόμενό μας είναι στα αγγλικά, θα έχουμε:: <html lang="en"> </html>
To στοιχείο <head>
-element ακολουθεί την <html>
ετικέτα και τελειώνει πριν τη <body>
ετικέτα- tag. Περιέχει πληροφορίες σχετικά με την ιστοσελίδα που συνήθως δεν εμφανίζεται στη σελίδα. Περιέχει επίσης το στοιχείο <title>
όπου δηλώνουμε τον τίτλο του εγγράφου μας.
Για να εμφανίσει η ιστοσελίδα μας ελληνικούς χαρακτήρες πρέπει να προσθέσουμε τον ακόλουθο κώδικα μέσα στο <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Language" content="el">
Στο στοιχείο <body>
τοποθετούμε το περιεχόμενό μας. Οτιδήποτε βρίσκεται στο <body>
είναι ορατό.
Άσκηση
- Αντιγράψτε τον προηγούμενο κώδικα
- Ανοίξτε τον επεγεργαστή και δημιουργήστε ένα νέο έγγραφο
- Επικολλήστε τον κώδικα στη σελίδα
- Αποθηκεύστε τη σελίδα ως
exersice01.3.01.html
στον φλακελο "Exercises". - Δείτε τη σελίδα στον browser.
Πού εμφανίζεται ο τίτλος "Simple Web Page";