HTMLHtml σημαίνει HyperText Markup Language , είναι δηλαδή μια γλώσσα που μας επιτρέπει να μορφοποιούμε καποιες πληροφορίες προκειμένου να εμφανιστούν με τον τρόπο που θέλουμε σε έναν Browser . Η HTML δεν είναι γλώσσα προγραμματισμού αλλα γλώσσα μορφοποίησης . Είναι μια περιγραφική γλώσσα , δηλαδή ένας ειδικός τρόπος γραφής κειμένου και κλήσης άλλων αρχέιων η εφαρμογών βασισμένος σε ειδικές
ετικέτες (tags). Οι ετικέτες αυτές περικλείονται μέσα σε σύμβολα < και >. Οι ετικέτες περικλείουν μια πληροφορία που θέλουμε
να μορφοποιήσουμε , υπάρχει δηλαδή μια ετικέτα που δηλώνει το τέλος της μορφοποίησης είναι ιδια με την ετικέτα που δηλώνει την αρχή με την μόνη διαφορά οτι περιέχει και τον χαρακτήρα / . Η γενική μορφή μιας ετικέτας ειναι:
<ετικέτα> Κείμενο </ετικέτα>Π . χ η οδηγία για να γίνει ενα κείμενο bold ειναι:
> το κείμενο που θα ειναι bold
Η HTML δεν "θέτει" περιορισμούς στο αν τα γράμματα της ετικέτας θα είναι κεφαλαία η μικρά. Είναι ομώς προτιμότερο να χρησιμοποιήσουμε μικρά γραμματα,γιατι πολλές φορές τα κεφαλαία Ελληνικά "μοίαζουν" με τα κεφαλαία Αγγλικά.Μπορεί όμως οπτικά να φαίνονται ίδια όμως πρόκειται για δύο διαφορετικά με αποτέλεσμα η εντολή να μην γινει κατανοητή απο τον browser και αυτός να την αγνοεί.
Π.χ Η ετικέτα για μια επικεφαλίδα ειναι
<h1> Επικεφαλίδα </h1> ,αν "ξεχαστούμε" και γραψουμε την ετικέτα με κεφαλαία ελληνικά το οπτικό αποτέλεσμα στον κώδικα θα ειναι
<H1> Επικεφαλίδα </H1>. Εμείς δεν θα καταλάβουμε τη διαφορά αλλα ο browser θα την καταλάβει και θα αγνοήσει την ετικέτα.
ΔΗΜΗΙΟΥΡΓΏΝΤΑΣ ΕΝΑ HTML ΑΡΧΕΙΟΓια να δημιουργήσουμε ενα html αρχείο θα πρέπει να χρησιμοποιήσουμε ενα απλο επεξεργαστή κειμένου.Ο επεξεργαστής που χρησιμοποιήται συνήθως ειναι το Σημειωματάριο (Notepad).Ανοίγουμε λοιπόν το σημειωματάριο και επιλέγουμε Αποθήκευση.
Επιλέγουμε σημείο αποθηκευσης και στην συνέχεια γράφουμε το όνομα που θέλουμε να δώσουμε στην ιστοσελίδα μασ και δίνουμε την κατάληξη .html ή .htm.
Μόλις δημιουργησουμε το αρχειο μας το πρώτο πραγμα που θα πρέπει να κάνουμε ειναι να γράψουμε τις βασικές εντολες της HTML τις οποίες πρέπει να περιέχει καθε HTML αρχείο.Οι εντολές χωρίζονται σε αυτές που περικλέιουν πληροφορίες που δεν εμφανίζονται στην οθονη του browser και σε αυτές που εμφανίζονται.Δηλαδή απο τις ετικέτες που ανήκουν στο
κεφάλι της σελίδας και περιέχουν πληροφορίες για την σελίδα και στο
σώμα που περιέχονται πληροφορίες που εμφανίζονται στην οθόνη του browser.
Όλος ο κωδικας της HTML περιέχεται μέσα στις ετικέτες
<html> ... </html>. Μέσα σε αυτή περιέχονται οι ετικέτες
<head> .... </head> δηλαδή το "κέφαλι" της html και μετά η
<body> .... </body> δηλαδή το "σώμα" της σελίδας
<html>
<head>
<title> Η πρώτη μου Ιστοσελίδα </title>
</head>
<body>
....................
</body>
</html>H Ετικέτα
<title> Η πρώτη μου Ιστοσελίδα </title> περιέχεται μέσα στην ετικέτα
<head> .... </head> και η πληροφορίες που περιέχονται μέσα σε αυτή
(<title>) εμφανίζονται στην γραμμή του browser και οχι μεσα σε αυτόν.
ΒΑΣΙΚΑ ΣΤΟΙΧΕΙΑτυπος εγγράφου <HTML> </HTML> Ορίζει την αρχή και το τελος
τιτλος <TITLE> </TITLE> εμφανίζεται στην μπλέ μπαρα του browser μπενει μεταξυ <HEAD> </HEAD>
επιφυλλίδα <HEAD> </HEAD> Εδω μπαίνει ο τιτλος της σελίδας τα styles και η java
βασικός κορμος <BODY> </BODY> το κύριο υλικό της σελίδας
ΜΟΡΦΟΠΟΙΗΣΗ ΚΕΙΜΕΝΟΥΕντονη γραφη <B> </B>
πλακια γραφη <I> </I>
υπογραμμιση <U> </U>
επικεφαλιδα <HI> </HI>
δεχεται 6 ορισμους:Η1 ως και Η6.Δημιουργει διαφορετικου μεγέθους χαρακτήρεςεντονη εμφαση <STRONG> </STRONG>
μεγαλα γραμματα <BIG> </BIG>
μικρα γραμματα <SMALL> </SMALL>
διαγραφη <STRIKE> </STRIKE>
εκθέτης <SUP> </SUP>
δείκτης <SUB> </SUB>
γραφομηχανή <TT> </TT>
προμορφοιποημένο <PRE> </PRE>
εμφανίζει τα κένα διαστήματα οπως εχουν γραφείστοίχη στο κέντρο <CENTER> </CENTER>
μεγεθος γραμμάτων <FONT SIZE=i> </FONT>
με τιμές i απο 1 ως και 7χρώμα γραμμάτων <FONT COLOR="#$$$$$$"> </FONT>
το χρώμα ορίζεται με τρέις (διψήφιους) δεκαεξαδικούς αριθμούς ή με το όνομα τ.επιλογή γραμματοσειρας <FONT FACE="ονομα γραμματοσειράς"> </FONT>
κινούμενο σχέδιο <MARQUEE> </MARQUEE>
ΔΙΑΧΩΡΙΣΤΕΣπαραγραφος <P>
στοίχηση παραγράφου <P ALIGN=LEFT | CENTER | RIGHT> </P>
πλήρης στοίχηση παραγραφου <P ALIGN=JUSTIFY> </P>
αλλαγή σειράς <BR>
οριζόντια γραμμή <HR>
χρώμμα γραμμης <HR COLOR="#$$$$$$">
το χρώμα ορίζεται με τρέις (διψήφιους) δεκαεξαδικούς αριθμούς ή με το όνομα του.στοίχηση γραμμης <HR ALIGN=LEFT | RIGHT | CENTER>
πάχος γραμμης <HR SIZE=i>
Σε Pixelsπλατος γραμμης <HR WIDTH=i>
Σε Pixelsπλάτος γραμμης <HR WIDTH="%">
Ως ποσοστό του πλάτους σελίδαςσυμπαγής γραμμή <HR NOSHADE>
Διχως την τριδιαστατη οψηΦΟΝΤΟ ΚΑΙ ΧΡΩΜΑΤΑΕπαναλαμβανομενη εικόνα φοντου <BODY BACKGROUND="Διαδρομή αρχείου εικόνας">
υδατογράφημα <BODY BGPROPERTIES="FIXED">
χρωμα φοντου <BODY BGCOLOR="#$$$$$$">
το χρώμα ορίζεται με τρέις (διψήφιους) δεκαεξαδικούς αριθμούς ή με το όνομα του.βασικό χρωμα κειμένου <BODY TEXT="#$$$$$$">
το χρώμα ορίζεται με τρέις (διψήφιους) δεκαεξαδικούς αριθμούς ή με το όνομα τ.χρώμα συνδέσμων <BODY LINK="#$$$$$$">
το χρώμα ορίζεται με τρέις (διψήφιους) δεκαεξαδικούς αριθμούς ή με το όνομα του.χρώμα συνδέσμων που έχουμε επισκεφτεί <BODY VLINK="#$$$$$$"> -//-
ενεργός συνδεσμος <BODY ALINK="#$$$$$$>
το χρώμα ορίζεται με τρέις (διψήφιους) δεκαεξαδικούς αριθμούς ή με το όνομα του.ΛΙΣΤΕΣΑπλή λιστα <UL> <LI> <LI>....<LI> </UL> ΤΟ <LI>
μπαίνει μπροστά απο κάθε στοιχείο της λίσταςτύπος κουκίδας <UL TYPE=DISC | CIRCLE | SQUARE>
για όλη τη λιστατύπος κουκίδας <LI TYPE=DISC | CIRCLE | SQUARE>
για το συγκεκριμένο στοιχείο της λίσταςαριθμιμένη λιστα <OL> <LI> <LI>...<LI> </OL> ΤΟ <LI>
μπαίνει μπροστά απο κάθε στοιχείο της λίσταςμορφή αρίθμησης <OL TYPE=A|a|I|i|1>
για όλη τη λισταμορφή αρίθμησης <LI TYPE=A|a|I|i|1>
για το συγκεκριμένο στοιχείο της λίσταςαριθμός έναρξης αρίθμησης <OL START=αριρμός>
για όλη τη λισταλιστα επεξηγήσεων <DL> <DT> <DD> <DT> <DD> ... <DT> <DD> </DL>
(<DT>=όρος, <DD>=Επεξήγηση)ΓΡΑΦΙΚΑ ΚΑΙ ΗΧΟΣΕμφανιση εικόνας <IMG SRC="Διαδρομη αρχείου εικόνας>
στοιχηση εικονας <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT>
στοιχηση εικονας με το κειμενο <IMG SRC="διαδρομη αρχέιου εικόνας" ALIGN=TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM>
εναλλακτικο κειμενο αντι της εικονας <IMG SRC="διαδρομη αρχέιου εικόνας"ALT="Κειμενο">
Αν η εικόνα δεν εμφανιστειδιστασεις εικονας <IMG SRC="διαδρομη αρχέιου εικόνας"WIDTH=Αριθμός HEIGHT=Αριθμ (μπορουμε κ σε %)>
Ως διαστασεων Σελ.πλαισιο εικονας <IMG SRC="διαδρομη αρχέιου εικόνας"BORDER=Αριθμός>
Σε Pixels κενος χωρος γυρω απο την εικονα <IMG SRC="διαδρομη αρχέιου εικόνας"HSPACE=Αριθμός VSPACE=Αριθμός>
Σε Pixelsηχος <BGSOUND SRC="διαδρομη αρχέιου ηχου" LOOP=Αριθμός>
μπαινει μεταξυ <Head> και </Head>. Loop -1 Συνεχώςανανεωση περιεχομενου αυτοματα* <META HTTP-EQUIV="Refresh" CONTENT"χρονος σε δευτερολεπτα; URL=ονομασια σελίδας">
Αυτό ηταν ο Οδηγός ειναι 100% Δικος μου. μου πηρε περιπου μια μερα να το γραψω.
Ελπιζω να βοηθηση καπως για οτι καινουργιο μαθαινω θα κανω UPDATE κάθε μερα.
Ευχαριστώ πολυ.
Linkback: https://l2topzone.com/forum/index.php?topic=805.0 
Topic: [Οδηγός]Html ετικέτες και πως τις χρησιμοποιείτε (Read 3592 times)
