Επανάληψη HTML 1

Καταρχήν χρησιμοποιήστε το πρόγραμμα Notepad++ για να γράψετε τον κώδικα. Μπορείτε να έχετε ταυτόχρονα πολλά έγγραφα ανοιχτά, κάνει highlight τον κώδικα, υποστηρίζει πλήθος γλωσσών και πολλά άλλα.



Βασική δομή ενός HTML αρχείου

Ένα HTML αρχείο έχει δύο βασικά κομμάτια
- την Κεφαλή <head>
- το Σώμα <body>

κώδικας:
<HTML>
<HEAD>
</HEAD>
<BODY>
</BODY>
</HTML>



Στο <head> βάζουμε ότι έχει σχέση με τον τύπο και την περιγραφή της σελίδας μας, όπως τον τίτλο, την περιγραφή, την κωδικοσελίδα, τις λέξεις κλειδιά, κ.α.

Στο <body> βάζουμε όλα όσα θέλουμε να εμφανίσουμε στην οθόνη του επισκέπτη μας.

κώδικας:

<HTML>
<HEAD>
<title >To keimeno afto emfanizetai ston titlo</title >
</HEAD>
<BODY>
To keimeno afto emfanizetai sto soma tis selidas
</BODY>
</HTML>



Στη συνέχεια αποθηκεύουμε το αρχείο με κατάληξη .html και ανοίγουμε με ένα browser το αρχείο που έχει δημιουργηθεί.

Χρώμα Φόντου

Για να αλλάξουμε χρώμα στο φόντο της σελίδας προσθέτουμε την ιδιότητα bgcolor στο tag <BODY> δίνοντας απλά το όνομα του χρώματος σαν τιμή στην ιδιότητα bgcolor ως εξής :

<BODY BGCOLOR=red>
<BODY BGCOLOR=yellow>

Υπάρχει η δυνατότητα ορισμού RGB τιμών χρώματος μέσω τριών δεξαεκαδικών αριθμών

<BODY BGCOLOR=#FFFFDD>

Επικεφαλίδες

Χρησιμοποιούνται για να καθορίσουν το μέγεθος των γραμμάτων που περιλαμβάνουν και παίρνουν τιμές από 1 έως 6. Σύνταξη :

<h1>Epikefalida megethous 1</h1>
<h2>Epikefalida megethous 2</h2>

<h3>Epikefalida megethous 3</h3>
<h4>Epikefalida megethous 4</h4>
<h5>Epikefalida megethous 5</h5>
<h6>Epikefalida megethous 6</h6>


Μορφοποίηση


Τα tags που συνήθως χρησιμοποιούνται είναι το

<b> Entona </b> <i> Plagia </i> <u> Ypogrammismena </u>

Παράγραφοι - Γραμμές

Αλλαγή παραγράφου γίνεται με το tag <p> , αλλαγή γραμμής με το <br> και προσθήκη οριζόντιας γραμμής με το <hr>. Παράδειγμα ο κώδικας :


έχει σαν αποτέλεσμα :

br kai p apotelesma

Tο tag hr που προσθέτει την οριζόντια γραμμή παίρνει σαν ιδιότητες τα
align=left ή align=right ή align=center που στοιχίζουν τη γραμμή αριστερά, δεξιά ή στο κέντρο αντίστοιχα,
το noshade για να μην εμφανίζεται σκιά,
το size=αριθμός για το πάχος της γραμμής (π.χ. size=6) και
το width=ποσοστό ή αριθμός σε pixel για το πλάτος της γραμμής (π.χ. width=70% ή width=250)

Σχόλια