Κεφάλαιο 11 - Εισαγωγή στην HTML

Εκτύπωση
Ημερομηνία δημοσίευσης

HTML είναι το ακρώνυμο από το Hyper Text Markup Language που σημαίνει γλώσσα χαρακτηρισμού υπερκειμένου. Η χρήση μιας γλώσσας χαρακτηρισμού σημαίνει ότι γράφεται πρώτα το κείμενο και έπειτα προσθέτονται ειδικά σύμβολα γύρω από τις λέξεις ή από ολόκληρες προτάσεις ώστε να καθοριστεί η εμφάνιση τους στην οθόνη. Τα ειδικά σύμβολα στην HTML λέγονται ετικέτες (tags). Η HTML διαθέτει ένα πεπερασμένο αριθμό ετικετών που μπορούμε να χρησιμοποιήσουμε. Η πρώτη οροθετεί την αρχή ισχύος της και η δεύτερη το τέλος. Για ορισμένες ετικέτες, το δεύτερο μέλος του ζεύγους μπορεί να παραλειφθεί. Η γενική μορφή είναι:
<tag "πιθανές παράμετροι"> κείμενο... </tag>

Βασικές ετικέτες (tags) της HTML
<html> ..... </html>  Οροθετεί την αρχή και το τέλος μιας ιστοσελίδας
<head> ..... </head>  Οροθετεί το τμήμα εκείνο της ιστοσελίδας στο οποίο ορίζονται διαχειριστικής φύσεως πληροφορίες που αφορούν το περιεχόμενο της ιστοσελίδας
<body> ..... </body>  Οροθετεί το περιεχόμενο της ιστοσελίδας
<title> ..... </title>  Ορίζει τον τίτλο της ιστοσελίδας. Τοποθετείται στην περιοχή μεταξύ <head> και </head>. Συνήθως εμφανίζεται στον τίτλο του παραθύρου του φυλλομετρητή. π.χ. 
<title> Αυτός είναι ο τίτλος </title>
<h1> ..... </h1>
<h2> ..... </h2>
<h3> ..... </h3>
<h4> ..... </h4>
<h5> ..... </h5>
<h6> ..... </h6>
 Καθορισμός επικεφαλίδων. Υπάρχουν 6 επίπεδα φθίνουσας τάξης με το <h1> να είναι η μεγαλύτερη επικεφαλίδα και το <h6> η μικρότερη.
<p> ..... </p>  Ορισμός παραγράφου
<b> ..... </b>  Έντονη γραφή
<i> ..... </i>  Πλάγια γραφή
<u> ..... </u>  Υπογράμμιση
<br>  Αλλαγή γραμμής
&nbsp;  Εισαγωγή κενού (non-breaking space). Αν γράψετε στο κείμενό σας 10 κενά, ο φυλλομετρητής θα αφαιρέσει τα 9 από αυτά. Για να προσθέσετε πραγματικά κενά στο κείμενό σας, μπορείτε να χρησιμοποιήσετε τον ειδικό χαρακτήρα &nbsp;
<ul> ..... </ul>  Ορίζει λίστα με κουκίδες (bullets)
<ol> ..... </ol>  Ορίζει αριθμημένη λίστα
<li> ..... </li>

 Ορίζει τα στοιχεία λίστας αριθμημένης ή όχι. π.χ.
<ol>
     <li> Πρώτο στοιχείο λίστας </li>
     <li> Δεύτερο στοιχείο λίστας </li>
     <li> Τρίτο στοιχείο λίστας </li>
</ol>

<img> ..... </img>

 Ορίζει την εισαγωγή κάποιας εικόνας (image), η οποία βρίσκεται σε άλλο αρχείο από αυτό της ιστοσελίδας. Το όνομα του αρχείου εμφανίζεται ως παράμετρος μέσα στην ετικέτα π.χ.
<img src= "./image1.jpeg" width="200" height="150">
src είναι το όνομα αρχείου που περιέχει την εικόνα, width και height είναι το πλάτος και το ύψος της σε εικονοστοιχεία (pixels).

<a> ..... </a>  Με αυτή την ετικέτα ορίζεται ένας σύνδεσμος προς μια ιστοσελίδα, η σε σημείο ιστοσελίδας. Ο σύνδεσμος ενεργοποιείται όταν στο φυλλομετρητή επιλέξουμε αυτό που υπάρχει ανάμεσα στο <a> και στο </a>. Η ιστοσελίδα στην οποία οδηγεί ο σύνδεσμος μπορεί να είναι στην ίδια τοποθεσία ή σε οποιαδήποτε άλλη στο διαδίκτυο. π.χ.
<a href="http://www.google.gr"> Αυτός είναι ο σύνδεσμος της google </a>

Σημειώσεις για τη γλώσσα HTML μπορείτε να βρείτε πατώντας εδώ.

Μπορείτε να δείτε μια σειρά από μαθησιακές δραστηριότητες – μαθήματα ανάπτυξης / τροποποίησης κώδικα.

Τα παραπάνω μαθήματα και παιχνίδια ετοιμάστηκαν από την εταιρία infolearn (www.infolearn.gr) και ενσωματώθηκαν στο προϊόν της TEST4U (www.test4u.eu) με την χορηγία του φορέα DIPLOMA (www.diploma.edu.gr) .

Καλωσόρισμα

Σας καλωσορίζουμε στην ιστοσελίδα του Εσπερινού ΕΠΑγγελματικού Λυκείου του Πλατανιά.

Έχοντας υπόψη ότι το διαδίκτυο έχει καταστεί ένα χρήσιμο και απαραίτητο εργαλείο για κάθε σύγχρονο πολίτη, με πολύ ενθουσιασμό σχεδιάστηκε, για πρώτη χρονιά, η ιστοσελίδα του σχολείου μας.

ΕΠΑΛ Πλατανιά

Βρισκόμαστε στην ευχάριστη θέση να σας ανακοινώσουμε ότι θα ξεκινήσει να λειτουργεί το Εσπερινό ΕΠΑ.Λ ΠΛΑΤΑΝΙΑ με ωράριο λειτουργίας 19.00 μ.μ έως 22.30 μ.μ.  Θα στεγαστεί στο Γυμνάσιο Πλατανιά.

Μια ακόμα εκπαιδευτική δομή δημόσιας εκπαίδευσης στο Δήμο μας θα δώσει την δυνατότητα σε κυρίως ενήλικους να αποκτήσουν Απολυτήριο Λυκείου και Πτυχίο στην ειδικότητα που επιθυμούν.

 


©Εσπερινό ΕΠΑγγελματικό Λύκειο Πλατανιά.

Σχεδίαση - Υλοποίηση Ιστότοπου: Τζωρτζάκης Μιχάλης (ΠΕ20).

 

Wednesday the 21st.
Copyright 2017

©