Μάθημα 1 > Δομή HTML. html head body

Μέγεθος: px
Εμφάνιση ξεκινά από τη σελίδα:

Download "Μάθημα 1 > Δομή HTML. html head body"

Transcript

1 Μάθημα 1 > Δομή HTML Αυτός είναι ο κώδικας από το προηγούμενο παράδειγμα: <html> <title>hello world!</title> Hello world! Αυτή η σελίδα εμφανίζει απλά το μήνυμα Hello world! στο πρόγραμμα περιήγησής σας. Ας ρίξουμε μια ματιά στη δομή της σελίδας. Η βασική δομή του εγγράφου αποτελείται από τις ακόλουθες τρεις ετικέτες: html head body Στον κώδικα μας βλέπουμε ότι η ετικέτα html περιέχει τις ετικέτες head και body. Η πρώτη είναι ο γονέας και οι άλλες παιδιά. Μπορείτε επίσης να φανταστείτε τη δομή της σελίδας, σαν ένα δέντρο.. Η ετικέτα html είναι το ίδιο το δέντρο, και κάθε άλλη ετικέτα είναι ένα κλαδί σε αυτό το δέντρο. Σαν αποτέλεσμα, μπορεί να υπάρχει μόνο ένα δέντρο, αλλά ένα κλαδί μπορεί να έχει από κανένα έως πολλά άλλα κλαδιά. Η ετικέτα head περιλαμβάνει πληροφορίες για την ίδια την σελίδα. Για παράδειγμα τον τίτλο της, την κωδικοποίηση, τον εξωτερικό κώδικα ή τα στυλ που πρέπει να συμπεριληφθούν κτλ. Μην ανησυχείτε αν δεν γνωρίζετε τι είναι η κωδικοποίηση ή τα εξωτερικά αρχεία κώδικα. Θα αναφερθούμε σε αυτά αργότερα. Από την άλλη, η ετικέτα body περιλαμβάνει οτιδήποτε θα εμφανιστεί στη σελίδα. Γράψαμε το μήνυμα Hello World! και αυτό ακριβώς εμφανίστηκε. Κενά διαστήματα Τα κενά διαστήματα είναι χαρακτήρες που αντιπροσωπεύουν οριζόντιο ή κάθετο χώρο. Για παράδειγμα ο χαρακτήρας του διαστήματος, της αλλαγής γραμμής, της στηλοθέτησης κτλ. Στην HTML τα κενά διαστήματα αγνοούνται. Για να το καταλάβουμε καλύτερα ας μελετήσουμε τον παρακάτω κώδικα: <html> <title></title> Hello World!

2 Μπορούμε να δούμε ότι αν και έχουμε πολλές κενές γραμμές, διαστήματα και στηλοθέτες στο κείμενο, αυτό εμφανίζεται ακριβώς όπως και πριν: Hello World! Άσκηση 1 Τώρα που γνωρίζετε την βασική δομή ενός HTML αρχείου, γράψτε κώδικα χρησιμοποιώντας αυτή τη βασική δομή. Δεν χρειάζεται να έχετε ετικέτα title, ή κείμενο μέσα στο σώμα της σελίδας. Μάθημα 1 > Τίτλος σελίδας Μια σελίδα τίτλου ορίζει το κείμενο που εμφανίζεται στη γραμμή τίτλου του περιηγητή σας. <html> <title>η σελίδα μου</title> Hello world! Με αυτό τον κώδικα, το κείμενο που θα εμφανίζεται στη γραμμή τίτλου θα είναι Η σελίδα μου. Κάντε κλικ εδώ για να ρίξετε μια ματιά. Τώρα, αλλάξτε τον τίτλο της σελίδας του ακόλουθου κώδικα σε οτιδήποτε θέλετε. Μάθημα 1 > Σχόλια Ρίξτε μια ματιά στον παρακάτω κώδικα. <html> <title>πώς βάζουμε σχόλια</title> <!-- Αυτό είναι ένα σχόλιο ΗTML, και θα αγνοηθεί από τον φυλλομετρητή σας --> Πώς βάζουμε σχόλια σε μια σελίδα HTML! Πέρα από τον κώδικα, έχουμε γράψει ένα μικρό μήνυμα που εξηγεί τα σχόλια. Αυτές οι μικρές (ή μεγάλες σε ορισμένες περιπτώσεις) περιγραφές ονομάζονται σχόλια. Τα σχόλια δεν εκτελούνται και αγνοούνται από το πρόγραμμα περιήγησης. Αυτό που κάνουν, είναι να μας βοηθήσουν να κατανοήσουμε μπλοκ κώδικα που κάποιος άλλος, ή ακόμη και εμείς έχουμε γράψει. Αν θέλουμε να βάλουμε ένα σχόλιο πολλών γραμμών θα πρέπει να το εσωκλείσουμε σε <!-- και -- >

3 <!-- This is a comment --> Τώρα, μετατρέψτε το κείμενο Hello World σε σχόλιο. <html> <title>hello world!</title> Hello world! Μάθημα 1 > Block και inline στοιχεία Πριν προχωρήσουμε πρέπει να μιλήσουμε για τα δύο βασικά είδη των στοιχείων δηλαδή τα στοιχεία block και τα στοιχεία inline. Block στοιχεία Block στοιχεία είναι τα στοιχεία που καταλαμβάνουν όλο το διαθέσιμο πλάτος του γονικό στοιχείο τους. Προκαλούν επίσης την δημιουργία μιας νέας γραμμής πριν και μετά από τη θέση που έχουν τοποθετηθεί. Το div στοιχείο είναι ένα στοιχείο μπλοκ. Αυτό σημαίνει ότι εάν τοποθετήσετε το ένα μετά το άλλο, θα εμφανίζονται το ένα κάτω από το άλλο και όχι δίπλα-δίπλα. Ρίξτε μια ματιά παρακάτω. <div>div 1</div> <div>div 2</div> <div>div 3</div> <div>div 4</div> Το παραπάνω παράδειγμα θα εμφανίσει: DIV 1 DIV 2 DIV 3 DIV 4 Στοιχεία Inline Στοιχεία inline είναι τα στοιχεία που καταλαμβάνουν μόνο τόσο πλάτος, όσο απαιτείται από το περιεχόμενο τους. Επίσης, δεν προκαλούν την αλλαγή γραμμής πριν ή μετά. Το span στοιχείο είναι ένα στοιχείο inline. Αυτό σημαίνει ότι εάν τοποθετήσετε το ένα μετά το άλλο, θα εμφανίζονται το ένα δίπλα στο άλλο. Ρίξτε μια ματιά παρακάτω. <span>span 1</span> <span>span 2</span> <span>span 3</span> <span>span 4</span> Το παραπάνω παράδειγμα θα εμφανίσει: SPAN 1 SPAN 2 SPAN 3 SPAN 4 Τώρα, τοποθετήστε ένα στοιχείο div με το κείμενο Hello, και ένα στοιχείο span με το κείμενο World.

4 <html> <title>hello world!</title> Μάθημα 2 > Επικεφαλίδες Λοιπόν, έφτασε η ώρα για να γνωρίσετε τις επικεφαλίδες. Επικεφαλίδες είναι στοιχεία block που μας παρέχουν έναν τρόπο για να οργανώσουμε το περιεχόμενό μας. Υπάρχουν έξι (6) διαθέσιμες επικεφαλίδες. Παρακάτω μπορούμε να τις δούμε Αυτό... <h1>επικεφαλίδα 1</h1> <h2>επικεφαλίδα 2</h2> <h3>επικεφαλίδα 3</h3> <h4>επικεφαλίδα 4</h4> <h5>επικεφαλίδα 5</h5> <h6>επικεφαλίδα 6</h6>... θα μας δώσει αυτό: Επικεφαλίδα 1 Επικεφαλίδα 2 Επικεφαλίδα 3 Επικεφαλίδα 4 Επικεφαλίδα 5 Επικεφαλίδα 6 Κάθε επικεφαλίδα έχει διαφορετική απόσταση και μέγεθος γραμματοσειράς. Ανάλογα με τις ανάγκες μας, θα πρέπει να χρησιμοποιήσουμε την αντίστοιχη επικεφαλίδα. Τώρα, βεβαιωθείτε ότι η λέξη Hello εμφανίζεται ως επικεφαλίδα 2, και η λέξη world ως επικεφαλίδα 4.

5 <html> <title>hello world!</title> Hello world Μάθημα 2 > Παράγραφοι Οι παράγραφοι είναι στοιχεία block που περιέχουν κείμενο. Όταν θέλετε να εμφανίσετε ένα κείμενο, θα πρέπει το εσωκλείετε στις ετικέτες <p></p>. Δώστε προσοχή στη λέξη πρέπει. Τοποθετώντας το κείμενο σε παραγράφους, δεν είναι υποχρεωτικό, αλλά είναι μια καλή πρακτική. <p>αυτή είναι μια παράγραφος</p> Εισάγετε δύο παραγράφους στο κείμενό σας. Η πρώτη θα πρέπει να περιέχει το κείμενο Θα πιω απόψε και η δεύτερη το φεγγάρι. <html> <title>τραγούδι</title> Μάθημα 2 > Στοίχιση παραγράφων Έχουμε αναφέρει ότι τα στοιχεία block καταλαμβάνουν όλο το διαθέσιμο πλάτος του γονικό στοιχείο τους. Αυτό σημαίνει ότι αν βάλουμε μια παράγραφο ως παιδί μέσα στο σώμα, το πλάτος της παραγράφου θα ταιριάζει με το πλάτος του σώματος. Αυτή είναι μια ευκαιρία για να μάθουμε σχετικά με τις επιλογές ευθυγράμμισης του κείμενου μέσα σε μια παράγραφο. Για το λόγο αυτό, θα χρησιμοποιήσουμε το χαρακτηριστικό align. Χαρακτηριστικά είναι επιλογές που έχουν οριστεί για μια συγκεκριμένη ετικέτα. Ρίξτε μια ματιά παρακάτω. <!-- Αυτή είναι η πρώτη φορά που βλέπουμε ένα χαρακτηριστικό--> <p align="left"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

6 Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </p> Ένα χαρακτηριστικό τοποθετείται μέσα στην ετικέτα, και η τιμή του πάντα περικλείεται με μονά ή διπλά εισαγωγικά. Το παραπάνω παράδειγμα ορίζει την ευθυγράμμιση του περιεχομένου του στοιχείου αριστερά. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Μπορείτε να δείτε ότι το κείμενο στοιχίζεται στα αριστερά. Υπάρχουν τέσσερις διαθέσιμες ευθυγραμμίσεις. left (αριστερή. Βλέπε το προηγούμενο παράδειγμα) right (δεξιά) Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. center (στο κέντρο) Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Du is aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. justify (πλήρης στοίχιση) Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Τώρα, βεβαιωθείτε ότι το κείμενο της παραγράφου στο παρακάτω σενάριο είναι πλήρως στοιχισμένο. Ας υποθέσουμε ότι θέλουμε να μορφοποιήσουμε την παράγραφο μας, κάπως έτσι: Γραμμή 1 Γραμμή 2 Γραμμή 3 Το πρώτο πράγμα που έρχεται στο μυαλό είναι να χτυπήσουμε το πλήκτρο enter στη θέση όπου θέλουμε την αλλαγή γραμμής. Κάτι σαν αυτό δηλαδή: <p> Γραμμή 1 Γραμμή 2 Γραμμή 3 </p>

7 Αλλά αν θα εκτελέστει αυτό στον περιηγητή μας, το αποτέλεσμα θα είναι: Γραμμή 1 Γραμμή 2 Γραμμή 3... τα πάντα θα εμφανίζονται στην ίδια γραμμή. Γιατί; Λόγω των κενών διαστημάτων που αναφέραμε σε προηγούμενο μάθημα. Για να εισάγετε μια αλλαγή γραμμής, θα πρέπει να χρησιμοποιήσετε την ετικέτα br. Ο κώδικας μας θα γίνει κάπως έτσι: <p> Γραμμή 1<br /> Γραμμή 2<br /> Γραμμή 3 </p>... και θα πάρουμε το επιθυμητό αποτέλεσμα μας: Γραμμή 1 Γραμμή 2 Γραμμή 3 Σημείωση Η ετικέτα αλλαγής γραμμής ονομάζεται επίσης ένα κενό στοιχείο. Τα κενά στοιχεία ορίζονται από δύο σημαντικά χαρακτηριστικά. 1. Δεν μπορεί να περιέχουν οποιοδήποτε κείμενο 2. Δεν μπορούν να έχουν μια ετικέτα κλεισίματος. Αυτό σημαίνει ότι δεν μπορείτε να έχετε <br></br> Αλλά έχουμε μάθει ότι όλες οι ετικέτες πρέπει να είναι κλειστές. Λοιπόν, αυτές οι ετικέτες κλείνουν χρησιμοποιώντας την κάθετο (/). Με αυτό τον τρόπο, η ετικέτα ανοίγει και κλείνει ταυτόχρονα, όπως παρακάτω: <br /> Μάθημα 3 > Μορφοποίηση κειμένου Θα υπάρξουν φορές που θα χρειαστεί να υπογραμμίσετε κάτι, ή να το γράψετε σε έντονη ή πλάγια γραφή. Υπάρχουν τρεις διαφορετικές και εύκολο να θυμάστε ετικέτες για αυτό. <b> έντονα (bold) <i> πλάγια (italic) <u> υπογραμμισμένα (underline) <b>αυτό</b> είναι κείμενο γραμμένο με έντονη γραμματοσειρά.<br /> <i>αυτό</i> είναι κείμενο γραμμένο με πλάγια γραμματοσειρά.<br /> <u>αυτό</u> είναι κείμενο γραμμένο με υπογραμμισμένη γραμματοσειρά....θα μας δώσει: Αυτό είναι κείμενο γραμμένο με έντονη γραμματοσειρά. Αυτό είναι κείμενο γραμμένο με πλάγια γραμματοσειρά. Αυτό είναι κείμενο γραμμένο με υπογραμμισμένη γραμματοσειρά.

8 Μάθημα 3 > Γραμματοσειρά κειμένου Εκτός από το έντονο και πλάγιο, η HTML μας παρέχει έναν τρόπο να ορίσουμε και τη γραμματοσειρά του κειμένου μας. Για παράδειγμα, αυτή είναι η Arial, αυτή είναι η Tahoma, αυτή είναι η Times New Roman και αυτή είναι η Courier New. Για να ρυθμίσουμε την επιθυμητή γραμματοσειρά, χρησιμοποιούμε την ετικέτα γραμματοσειράς font. Αλλά μόνη της η ετικέτα δεν είναι αρκετή. Χρειαζόμαστε ένα χαρακτηριστικό (θυμηθείτε το χαρακτηριστικό ευθυγράμμισης της παραγράφου align ) για να ορίσουμε το όνομα της γραμματοσειράς. Αυτό το χαρακτηριστικό είναι το face. Χρησιμοποιώντας το χαρακτηριστικό αυτό, έχουμε το ακόλουθο παράδειγμα. <font face="times New Roman">Αυτό το κείμενο είναι γραμμένο με γραμματοσειρά Times New Roman</font> Και μας εμφανίζει: Αυτό το κείμενο είναι γραμμένο με γραμματοσειρά Times New Roman Σημαντική σημείωση Δεν μπορείτε να χρησιμοποιήσετε οποιοδήποτε όνομα γραμματοσειράς σας αρέσει. Ο φυλλομετρητής σας χρησιμοποιεί γραμματοσειρές που είναι εγκατεστημένες στον υπολογιστή σας. Αυτό σημαίνει ότι, αν δεν έχετε τη γραμματοσειρά Times New Roman εγκατεστημένη, δεν θα είστε σε θέση να δείτε την σελίδα σωστά. Μεταξύ δημοφιλών λειτουργικών συστημάτων όπως τα Windows, Linux και Mac, υπάρχουν γραμματοσειρές που υπάρχουν σε όλα αυτά. Έτσι, αν υπάρχει μια γραμματοσειρά σε όλα αυτά την καθιστά ασφαλή για χρήση στο σχεδιασμό μας. Αυτές οι γραμματοσειρές ονομάζονται ασφαλής γραμματοσειρές ιστού. Μερικές από αυτές είναι: Arial Comic Sans MS Courier New Impact Lucida Console Tahoma Times New Roman Verdana Μάθημα 3 > Μέγεθος κειμένου Τώρα που γνωρίζουμε πώς να ορίσουμε τη γραμματοσειρά του κειμένου μας, ας δούμε πώς μπορούμε να αλλάξουμε το μέγεθός του. Θα χρησιμοποιήσουμε την ίδια ακριβώς ετικέτα, αλλά αυτή τη φορά θα προσθέσουμε την ιδιότητα μέγεθος (size). <font face="times New Roman" size="6">αυτό το κείμενο είναι γραμμένο με γραμματοσειρά Times New Roman και το μεγεθός του είναι 6.</font>

9 Αυτό το κείμενο είναι γραμμένο με γραμματοσειρά Times New Roman και το μεγεθός του είναι 6. Τα διαθέσιμα μεγέθη που μπορούν να χρησιμοποιηθούν είναι από 1 έως 7. Μάθημα 3 > Χρώμα κειμένου Τώρα θα δούμε κάτι λίγο πιο περίπλοκο. Τουλάχιστον θα είναι δύσκολο στην αρχή. Μόλις καταλάβουμε όμως πώς λειτουργεί θα είναι παιχνιδάκι. Θα μιλήσουμε για τα χρώματα. Υπάρχουν δύο τρόποι με τους οποίους μπορούμε να ορίσουμε ένα χρώμα. Χρησιμοποιώντας το όνομα του χρώματος π.χ. κόκινο (red) ή χρησιμοποιώντας το δεκαεξαδικό κωδικό του χρώματος (#ff0000) Χρώμα Όνομα Hex κόκκινο red #ff0000 πράσινο green #00ff00 Μπλε blue #0000ff Αυτά είναι τα τρία βασικά χρώματα από τα οποία όλα τα υπόλοιπα παράγονται. Ας εξηγήσουμε τι εννοούμε με το όνομα και με το hex. Όνομα Μπορείτε να επιλέξετε ένα χρώμα ορίζοντας το όνομά του. Για παράδειγμα, κόκκινο, πράσινο, μπλε, κίτρινο, μαύρο κλπ. Μια λίστα με τα υποστηριζόμενα ονόματα των χρωμάτων μπορείτε να βρείτε εδώ. hex απόσπασμα Wikipedia: Το δεκαεξαδικό σύστημα αρίθμησης είναι ένα θεσιακό σύστημα αναπαράστασης αριθμών. Έχει ως βάση του τον αριθμό 16. Αυτό σημαίνει ότι, σε μια σειρά ψηφίων, κάθε ψηφίο έχει αξία 16 φορές μεγαλύτερη από εκείνο που βρίσκεται αμέσως δεξιά του. Δηλαδή, οι θέσεις των ψηφίων στο δεκαεξαδικό σύστημα δηλώνουν μονάδες, 16άδες, 16Χ16=256άδες κ.ο.κ., σε αναλογία με το δεκαδικό σύστημα, όπου οι θέσεις δηλώνουν δυνάμεις του δέκα (μονάδες, δεκάδες, εκατοντάδες...). Για την αναπαράστασή του, το δεκαεξαδικό σύστημα έχει ανάγκη 16 ψηφίων. Για τα πρώτα δέκα, χρησιμοποιούνται τα ψηφία 0-9 της αραβικής αναπαράστασης του δεκαδικού συστήματος. Για να αναπαρασταθούν οι αξίες από το 10 έως και το 15, δανειζόμαστε τα πρώτα 6 κεφαλαία γράμματα του λατινικού αλφαβήτου: A, B, C, D, E και F. Οι δεκαεξαδικές αναπαραστάσεις των χρωμάτων αποτελούνται από τρείς τιμές, την τιμή του κόκκινου, του πράσινου και του μπλε. Κάθε τιμή αποτελείται από 2 ψηφία αι κυμαίνεται από την τιμή 00 ως και την ff (0-255).[00=0 και 255=ff] Κάθε δεκαεξαδική αναπαράσταση χρώματος ξεκινά με το #. Το χρώμα κόκκινο απεικονίζεται με #ff0000. κόκκινο = 255, πράσινο = 0 και μπλε = 0. Γνωρίζουμε ότι αν ανακατέψουμε κόκκινο με μπλε, θα πάρουμε το χρώμα φούξια. Χρησιμοποιώντας αυτό που έχουμε μάθει μέχρι τώρα, θα έχουμε αυτό το χρώμα, αν

10 ορίσουμε τις τιμές του κόκκινου σε 255, πράσινο σε 0 και το μπλε σε 255. #ff00ff = φούξια Ας επιστρέψουμε στον τρόπο με τον οποίο μπορούμε να ορίσουμε ένα χρώμα στο κείμενό μας. Μετά από τις ιδιότητες face και size, θα δούμε την του ιδιότητα color. <font color="#ff8044">αυτό το κείμενο είναι πορτοκαλί!</font> Αυτό το κείμενο είναι πορτοκαλί! Μπορείτε να διαβάσετε περισσότερα σχετικά με τα χρώματα ιστού εδώ. Μάθημα 4 > Σύνδεσμοι Επιτέλους φτάνουμε στο σημείο, όπου μπορούμε να δούμε τι κάνει τον ιστό αυτό που είναι. Οι σύνδεσμοι. Για να μπορέσετε να φτάσετε εδώ, θα πρέπει να έχετε κάνει κλικ σε πολλούς από αυτούς. Κάθε φορά που κάνετε κλικ σε έναν, είτε θα σας μεταφέρει σε μια άλλη σελίδα, η οποία είναι η πιο κοινή ενέργεια, ή μπορεί να εκτελεστεί κάτι πιο περίπλοκο (όπως η εμφάνιση μιας μικρής φόρμας). Στην HTML, μπορούμε να δημιουργήσουμε ένα σύνδεσμο, χρησιμοποιώντας την ετικέτα a. <a>κάντε κλίκ εδώ για να επισκευθείτε το google</a> Ωστόσο είναι ελλιπής. Πού θα μας οδηγήσει; Αυτό ορίζεται από την ιδιότητα href. Σημείωση: href σημαίνει «αναφορά υπερκειμένου» ('hypertext reference') Προσθέτουμε την ιδιότητα href και θέτουμε την τιμή της στη διεύθυνση URL στην οποία θέλουμε να οδηγηθούμε πατώντας το σύνδεσμο. <a href=" κλίκ εδώ για να επισκευθείτε το google</a> Το αποτέλεσμα θα είναι: κάντε κλίκ εδώ για να επισκευθείτε το google Όπως μπορείτε να δείτε, ή στην πραγματικότητα, όπως δεν μπορείτε να δείτε, η διεύθυνση URL προορισμού δεν είναι πουθενά στο ορατό κείμενο. Το μόνο ορατό κείμενο, είναι το κείμενο ανάμεσα στο άνοιγμα και το κλείσιμο της ετικέτας. Αυτός είναι ο τρόπος που λειτουργούν οι συνδέσεις. Εάν κάνετε κλικ στο σύνδεσμο, θα πάτε στην αρχική σελίδα της Google. Σημείωση: Στην πραγματικότητα η σύνδεση θα ανοίξει σε ένα νέο παράθυρο του προγράμματος περιήγησης. Η προεπιλεγμένη συμπεριφο ρά ενός συνδέσμου είναι να χρησιμοποιήσετε το ίδιο παράθυρο, αλλά για να μην χαλάσουμε το μάθημα και να μην περιηγηθείτε μακριά από αυτό, η σύνδεση θα ανοίξει σε ένα νέο παράθυρο. Τώρα, δημιουργήστε ένα σύνδεσμο για να πλοηγηθείτε στο Το κείμενο του συνδέσμου πρέπει να είναι Άνοιγμα του php.net Μάθημα 4 > Άνοιγμα σε άλλο παράθυρο Τώρα θα δούμε πώς εσείς μπορείτε να δημιουργήσετε ένα σύνδεσμο που θα ανοίξει σε νέο παράθυρο. Αυτό που χρειαζόμαστε είναι την παράμετρο target. Η τιμή αυτής της παραμέτρου που μας ενδιαφέρει είναι η _blank. Όταν η ιδιότητα στόχος δεν έχει οριστεί, ο φυλλομετρητής θα χρησιμοποιεί το ίδιο παράθυρο για να μεταβεί στη διεύθυνση URL προορισμού. Εάν ρυθμίσετε την παράμετρο target αλλά το αφήστε κενό, ο φυλλομετρητής θα χρησιμοποιήσει και πάλι το ίδιο παράθυρο. Αν όμως θέσουμε την τιμή σε _blank, ένα νέο παράθυρο θα ανοίξει. Ρίξτε μια ματιά.

11 <a href=" target="_blank">θα ανοίξω σε ένα νέο παράθυρο!</a> Θα ανοίξω σε ένα νέο παράθυρο! Μάθημα 4 > Επεξηγήσεις Έχετε ποτέ παρατηρήσει ότι όταν μετακινείτε το ποντίκι σας πάνω από μια σύνδεση, εμφανίζεται μια μικρή επεξήγηση; Βάλτε το ποντίκι σας εδώ και δείτε τι θα συμβεί. Το χαρακτηριστικό που απαιτείται για αυτή τη λειτουργία είναι το title, και ο κώδικας για το παραπάνω παράδειγμα είναι: <a href="#" title="μαγική επεξήγηση!">βάλτε το ποντίκι σας εδώ και δείτε τι θα συμβεί.</a> Δοκιμάστε να ορίσετε τον τίτλο του συνδέσμου του κώδικα σε PHP: Hypertext Preprocessor Μάθημα 4 > Εικόνες Τι γίνεται με τις εικόνες; Πώς μπορούμε να τις συμπεριλάβουμε στις σελίδες μας; Εύκολα. Θα χρησιμοποιήσουμε την ετικέτα img. Παρακάτω, μπορείτε να δείτε την εικόνα webe2.png....με χρήση αυτού του κώδικα: <img src="/img/webe2.png" alt="web-e2 logo" /> Θυμηθείτε εκείνα τα κενά στοιχεία που μιλήσαμε στο Μάθημα 1; Λοιπόν, αυτό είναι ένα από αυτά. Η ετικέτα ανοίγματος είναι η <img και η ετικέτα κλεισίματος είναι το />. Ας ρίξουμε μια ματιά στα χαρακτηριστικά. src Αυτό το χαρακτηριστικό ορίζει τη διαδρομή της εικόνας που θα εμφανιστεί. Μπορείτε να δείτε ότι δεν υπάρχει μπροστά από την πραγματική διαδρομή. Η πραγματική ιστοσελίδα παραλείφθηκε επειδή η εικόνα βρίσκεται στον ίδιο διακομιστή, με την τρέχουσα σελίδα. Μπορούμε να γράψουμε ή /img/webe2.png χωρίς καμία διαφορά. alt Αυτό το χαρακτηριστικό καθορίζει το εναλλακτικό κείμενο για μια εικόνα. Εάν η εικόνα προέλευσης δεν βρέθηκε ή δεν μπορεί να εμφανιστεί, αυτό το κείμενο εμφανίζεται αντί της εικόνας. <!-- Η εικόνα δεν υπάρχει--> <img src="/img/webe22.png" alt="εδώ βρίσκεται μια εικόνα!" /> θα μας δώσει

12 αντί για την πραγματική εικόνα. Σημείωση: Υπάρχουν μερικά επιπλέον χαρακτηριστικά που μπορούμε να θέσουμε σε μια ετικέτα εικόνας, όπως το πλάτος και το ύψος, αλλά αυτά δεν θα συζητηθούν αυτή τη στιγμή. Μάθημα 5 > Αριθμημένη λίστα Ένα άλλο αντικείμενο στις ιστοσελίδες είναι οι λίστες. Υπάρχουν δύο τύποι λίστας. οι αριθμημένες και οι μη αριθμημένες (κουκίδες). Μια αριθμημένη λίστα μοιάζει με: 1. Στοιχείο Α 2. Στοιχείο Α 3. Στοιχείο Α 4. Στοιχείο Α 5. Στοιχείο Α Η ετικέτα για την αριθμημένη (ταξινομημένη, διατεταγμένη, ordered list) είναι πολύ εύκολο να τη θυμάστε, ol. Κάθε στοιχείο της λίστας, έχει τη δική του ετικέτα li. <ol> <li>στοιχείο Α</li> <li>στοιχείο Β</li> <li>στοιχείο Γ</li> <li>στοιχείο Δ</li> <li>στοιχείο Ε</li> </ol> Όπως μπορείτε να δείτε από το άνοιγμα ως το κλείσιμο της ol, ετικέτας υπάρχουν πέντε (5) ετικέτες στοιχεία της λίστας (li). Υπάρχουν δύο χαρακτηριστικά για ταξινομημένες λίστες: start και type. Με τη χρήση του start, μπορούμε να καθορίσουμε τον αριθμό από τον οποίο η αρίθμηση θα ξεκινήσει. <ol start="3"> <li>στοιχείο Α</li> <li>στοιχείο Β</li> <li>στοιχείο Γ</li> <li>στοιχείο Δ</li> <li>στοιχείο Ε</li> </ol> 3. Στοιχείο Α 4. Στοιχείο Α 5. Στοιχείο Α 6. Στοιχείο Α 7. Στοιχείο Α

13 Με τη χρήση του type μπορούμε να καθορίσουμε τον τύπο της αρίθμησης. Μπορείτε να επιλέξετε ανάμεσα σε 1, A, a, I και i. <ol type="a"> <li>στοιχείο Α</li> <li>στοιχείο Β</li> <li>στοιχείο Γ</li> <li>στοιχείο Δ</li> <li>στοιχείο Ε</li> </ol> a. Στοιχείο Α b. Στοιχείο Α c. Στοιχείο Α d. Στοιχείο Α e. Στοιχείο Α Μπορείτε επίσης να έχετε μια λίστα μέσα σε μια λίστα, ακριβώς όπως παρακάτω: <ol type="a"> <li>στοιχείο 1</li> <li>στοιχείο 2</li> <li>στοιχείο 3</li> <li> <ol type="i"> <li>στοιχείο 3.1</li> <li>στοιχείο 3.2</li> <li>στοιχείο 3.3</li> </ol> </li> <li>στοιχείο 4</li> </ol> a. Στοιχείο 1 b. Στοιχείο 1 c. Στοιχείο 1 d. i. Στοιχείο 3.1 ii. Στοιχείο 3.1 iii. Στοιχείο 3.1 e. Στοιχείο 1 Τώρα, δημιουργείστε μια αριθμημένη λίστα με τα ακόλουθα στοιχεία της λίστας: HTML, CSS, JavaScript, PHP και MySQL. Μάθημα 5 > Μη αριθμημένη λίστα Αυτό θα είναι πολύ εύκολο. Μια μη αριθμημένη λίστα μοιάζει έτσι: <ul> <li>στοιχείο Α</li> <li>στοιχείο Β</li> <li>στοιχείο Γ</li>

14 <li>στοιχείο Δ</li> <li>στοιχείο Ε</li> </ul> Η ετικέτα για την μη αριθμημένη λίστα (unordered list) είναι η ul. Για άλλη μια φορά, κάθε στοιχείο της λίστας έχει τη δική του ετικέτα li. Στοιχείο Α Στοιχείο Β Στοιχείο Γ Στοιχείο Δ Στοιχείο Ε Οι μη αριθμημένες λίστες έχουν ένα χαρακτηριστικό που καθορίζει την εικόνα της κουκίδας. Αυτό είναι το χαρακτηριστικό type, με το οποίο μπορείτε να ρυθμίσετε το σχήμα των κουκκίδων με εκείνο ενός δίσκου (disc), τετραγώνου (square) ή κύκλου (circle). <ul type="square"> <li>στοιχείο Α</li> <li>στοιχείο Β</li> <li>στοιχείο Γ</li> <li>στοιχείο Δ</li> <li>στοιχείο Ε</li> </ul> Στοιχείο Α Στοιχείο Β Στοιχείο Γ Στοιχείο Δ Στοιχείο Ε Και ακριβώς όπως με τις αριθμημένες λίστες μπορούν να περιέχουν και άλλες λίστες μέσα τους. Τώρα, δημιουργήστε μια μη αριθμημένη λίστα με τα ακόλουθα στοιχεία της λίστας: HTML, CSS, JavaScript, PHP και MySQL.

Template MS-Word 2010

Template MS-Word 2010 Γεώργιος Κουρουπέτρογλου Template MS-Word 2010 Έκδοση: 1.0 Αθήνα 2013 Έργο «Κεντρικό Μητρώο Ελληνικών Ανοικτών Μαθημάτων» http://ocw-project.gunet.gr Το έργο Κεντρικό Μητρώο Ελληνικών Ανοικτών Μαθημάτων

Διαβάστε περισσότερα

Template MS-Word 2013

Template MS-Word 2013 Γεώργιος Κουρουπέτρογλου Template MS-Word 2013 Έκδοση: 1.0 Αθήνα 2014 Έργο «Κεντρικό Μητρώο Ελληνικών Ανοικτών Μαθημάτων» http://ocw-project.gunet.gr Στην υλοποίηση του παραδοτέου αυτού συνέβαλαν οι: Γεώργιος

Διαβάστε περισσότερα

Διερευνώντας την ασφάλεια στο διαδίκτυο με εργαλεία ΤΠΕ. Ροδούλα Σαμψών Σάββα Δημοτικό Σχολείο Δευτεράς

Διερευνώντας την ασφάλεια στο διαδίκτυο με εργαλεία ΤΠΕ. Ροδούλα Σαμψών Σάββα Δημοτικό Σχολείο Δευτεράς Διερευνώντας την ασφάλεια στο διαδίκτυο με εργαλεία ΤΠΕ Ροδούλα Σαμψών Σάββα Δημοτικό Σχολείο Δευτεράς Διαδίκτυο: ευλογία ή κατάρα; ΤΑΞΗ: ΜΑΘΗΜΑ: ΣΚΟΠΟΣ: Στ Δημοτικού Αγωγή Υγείας Τα παιδιά να διερευνήσουν

Διαβάστε περισσότερα

Template MS-PowerPoint 2010 Έκδοση 1.0

Template MS-PowerPoint 2010 Έκδοση 1.0 Κεντρικό Μητρώο Ελληνικών Ανοικτών Μαθημάτων Template MS-PowerPoint 2010 Έκδοση 1.0 Γεώργιος Κουρουπέτρογλου koupe@di.uoa.gr Αδεια Χρήσης Το παρόν υλικό υπόκειται σε άδειες χρήσης Creative Commons. Στην

Διαβάστε περισσότερα

Template MS-PowerPoint 2013 Έκδοση 1.0

Template MS-PowerPoint 2013 Έκδοση 1.0 Κεντρικό Μητρώο Ελληνικών Ανοικτών Μαθημάτων Template MS-PowerPoint 2013 Έκδοση 1.0 Γεώργιος Κουρουπέτρογλου koupe@di.uoa.gr Άδεια Χρήσης (1/3) Στην υλοποίηση του παραδοτέου αυτού συνέβαλαν οι: Γεώργιος

Διαβάστε περισσότερα

Ανάπτυξη ηλεκτρονικών μαθημάτων στην πλατφόρμα Open eclass. Ενότητα 1: Γνωριμία με την Open eclass

Ανάπτυξη ηλεκτρονικών μαθημάτων στην πλατφόρμα Open eclass. Ενότητα 1: Γνωριμία με την Open eclass Ανάπτυξη ηλεκτρονικών μαθημάτων στην πλατφόρμα Open eclass Ενότητα 1: Γνωριμία με την Open eclass Σκοποί ενότητας 2 Περιεχόμενα ενότητας 3 Χρήση Διατάξεων Διαφάνεια Τίτλου υπότιτλος Τίτλος και περιεχόμενο

Διαβάστε περισσότερα

Η ΠΑΡΟΥΣΙΑΣΗ ΤΗΣ ΕΡΕΥΝΗΤΙΚΗΣ ΕΡΓΑΣΙΑΣ

Η ΠΑΡΟΥΣΙΑΣΗ ΤΗΣ ΕΡΕΥΝΗΤΙΚΗΣ ΕΡΓΑΣΙΑΣ Η ΠΑΡΟΥΣΙΑΣΗ ΤΗΣ ΕΡΕΥΝΗΤΙΚΗΣ ΕΡΓΑΣΙΑΣ Καθηγητής Τεχνολογίας 3 ου ΓΕΛ Κερατσινίου Ο Ρόλος του Εκπαιδευτικού Στηρίζει τους μαθητές στην αξιοποίηση τρόπων αναπαράστασης των γνώσεων Στηρίζει τους μαθητές στην

Διαβάστε περισσότερα

Φαρμακοεπαγρύπνηση και Προστασία Προσωπικών Δεδομένων Από τη θεωρία στην πράξη

Φαρμακοεπαγρύπνηση και Προστασία Προσωπικών Δεδομένων Από τη θεωρία στην πράξη Φαρμακοεπαγρύπνηση και Προστασία Προσωπικών Δεδομένων Από τη θεωρία στην πράξη Στέλλα Κορούλη Τοπική Υπεύθυνη Φαρμακοεπαγρύπνησης Roche (HELLAS) AE Ευτυχία Αυγοκλούρη Healthcare Compliance Contact/ Data

Διαβάστε περισσότερα

Template προζβάζιμοσ MS-Word 2007

Template προζβάζιμοσ MS-Word 2007 Γεώργιος Κοσροσπέηρογλοσ Template προζβάζιμοσ MS-Word 2007 Έκδοζη: 1.1 Αθήνα 2013 Έργο «Κενηρικό Μηηρώο Ελληνικών Ανοικηών Μαθημάηων» http://ocw-project.gunet.gr Στθν υλοποίθςθ του παραδοτζου αυτοφ ςυνζβαλαν

Διαβάστε περισσότερα

ΜΕΤΑΦΡΑΣΗ ΓΕΝΙΚΩΝ ΚΕΙΜΕΝΩΝ Ι

ΜΕΤΑΦΡΑΣΗ ΓΕΝΙΚΩΝ ΚΕΙΜΕΝΩΝ Ι ΑΡΙΣΤΟΤΕΛΕΙΟ ΠΑΝΕΠΙΣΤΗΜΙΟ ΘΕΣΣΑΛΟΝΙΚΗΣ ΑΝΟΙΚΤΑ ΑΚΑΔΗΜΑΪΚΑ ΜΑΘΗΜΑΤΑ ΜΕΤΑΦΡΑΣΗ ΓΕΝΙΚΩΝ ΚΕΙΜΕΝΩΝ Ι Ενότητα 1: Εισαγωγή στα Γενικά Κείμενα Ελπίδα Λουπάκη Eπίκουρη Καθηγήτρια Άδειες Χρήσης Το παρόν εκπαιδευτικό

Διαβάστε περισσότερα

Οδηγός χρήσης της ταυτότητας της Κοινοβουλευτικής Ομάδας του ΕΛΚ 2015

Οδηγός χρήσης της ταυτότητας της Κοινοβουλευτικής Ομάδας του ΕΛΚ 2015 Οδηγός χρήσης της ταυτότητας της Κοινοβουλευτικής Ομάδας του ΕΛΚ 2015 EL Εικόνα: David Lliff Κοινοβουλευτική Ομάδα του ΕΛΚ στο Ευρωπαϊκό Κοινοβούλιο 60 Rue Wiertz 1047 Βρυξέλλες, Βέλγιο Εκδότης Pedro López

Διαβάστε περισσότερα

Γεώργιος Κοσροσπέηρογλοσ. Έθδοζε: 1.4. Αζήλα 2013

Γεώργιος Κοσροσπέηρογλοσ. Έθδοζε: 1.4. Αζήλα 2013 Γεώργιος Κοσροσπέηρογλοσ Template MS-Word 2010 Έθδοζε: 1.4 Αζήλα 2013 Έργο «Κενηρικό Μηηρώο Ελληνικών Ανοικηών Μαθημάηων» http://ocw-project.gunet.gr Έργο: Κεληρηθό Μεηρώο Διιεληθώλ Αλοηθηώλ Μαζεκάηωλ

Διαβάστε περισσότερα

Προγραμματισμός και Συστήματα στον Παγκόσμιο Ιστό Ενότητα 3: Server Side Scripting I - PHP

Προγραμματισμός και Συστήματα στον Παγκόσμιο Ιστό Ενότητα 3: Server Side Scripting I - PHP Προγραμματισμός και Συστήματα στον Παγκόσμιο Ιστό Ενότητα 3: Server Side Scripting I - PHP Καθ. Ιωάννης Γαροφαλάκης Πολυτεχνική Σχολή Μηχανικών Η/Υ & Πληροφορικής Σκοποί ενότητας Σκοπός της παρούσας ενότητας

Διαβάστε περισσότερα

CSS 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών

CSS 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών CSS 1 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης Creative

Διαβάστε περισσότερα

ΑΝΟΙΧΤΑ ΑΚΑΔΗΜΑΪΚΑ ΜΑΘΗΜΑΤΑ. Τίτλοσ Μακιματοσ. Ελόηεηα # (bold): Τίηινο Ελόηεηαο (normal) ----θελή γξακκή---- Όλνκα Καζεγεηή Τκήκα

ΑΝΟΙΧΤΑ ΑΚΑΔΗΜΑΪΚΑ ΜΑΘΗΜΑΤΑ. Τίτλοσ Μακιματοσ. Ελόηεηα # (bold): Τίηινο Ελόηεηαο (normal) ----θελή γξακκή---- Όλνκα Καζεγεηή Τκήκα ΑΝΟΙΧΤΑ ΑΚΑΔΗΜΑΪΚΑ ΜΑΘΗΜΑΤΑ Τίτλοσ Μακιματοσ Ελόηεηα # (bold): Τίηινο Ελόηεηαο (normal) ----θελή γξακκή---- Όλνκα Καζεγεηή Τκήκα Άδειεσ Χριςθσ Το παρόν εκπαιδευτικό υλικό υπόκειται ςε άδειεσ χρήςησ Creative

Διαβάστε περισσότερα

ΕΛΕΓΧΟΣ ΠΑΡΑΓΩΓΙΚΩΝ ΔΙΕΡΓΑΣΙΩΝ

ΕΛΕΓΧΟΣ ΠΑΡΑΓΩΓΙΚΩΝ ΔΙΕΡΓΑΣΙΩΝ ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ Ανώτατο Εκπαιδευτικό Ίδρυμα Πειραιά Τεχνολογικού Τομέα ΕΛΕΓΧΟΣ ΠΑΡΑΓΩΓΙΚΩΝ ΔΙΕΡΓΑΣΙΩΝ Ενότητα: Εμπειρία Συστήματα Ελέγχου (DCS SCADA) Αλαφοδήμος Κωνσταντίνος Τμήμα Μηχανικών Αυτοματισμού

Διαβάστε περισσότερα

Η γλώσσα HTML. Επιμέλεια: Δέγγλερη Σοφία

Η γλώσσα HTML. Επιμέλεια: Δέγγλερη Σοφία Η γλώσσα HTML Επιμέλεια: Δέγγλερη Σοφία Υπερκείμενο Το δομικό χαρακτηριστικό του Παγκόσμιου Ιστού Ένα αρχείο Απλό κείμενο και υπερσύνδεσμοι Υπερσύνδεσμος Μετάβαση σε διάφορα άλλα έγγραφα Αποτελείται από

Διαβάστε περισσότερα

Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML)

Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML) Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML) 1. Δημιουργία μιας απλής σελίδας HTML Ανοίξτε το Notepad ακολουθώντας τη διαδρομή Start All Programs Accessories Notepad Πληκτρολογήστε το ακόλουθο κείμενο:

Διαβάστε περισσότερα

ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 2o ΕΡΓΑΣΤΗΡΙΟ ΜΟΡΦΟΠΟΙΗΣΗ ΣΤΗΝ HTML

ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 2o ΕΡΓΑΣΤΗΡΙΟ ΜΟΡΦΟΠΟΙΗΣΗ ΣΤΗΝ HTML ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ ΠΕΡΙΕΧΟΜΕΝΟ ΜΑΘΗΜΑΤΟΣ 2o ΕΡΓΑΣΤΗΡΙΟ ΜΟΡΦΟΠΟΙΗΣΗ ΣΤΗΝ HTML 1. Μορφοποίηση κειμένου Ετικέτες στυλ 2. Ιδιότητες ετικετών 3. Λίστες 4. Υπερσυνδέσεις

Διαβάστε περισσότερα

Υδρογεωχημεία Αναλυτική Γεωχημεία Ενότητα 1: Γεωχημεία επιφανειακών νερών

Υδρογεωχημεία Αναλυτική Γεωχημεία Ενότητα 1: Γεωχημεία επιφανειακών νερών Υδρογεωχημεία Αναλυτική Γεωχημεία Ενότητα 1: Αριάδνη Αργυράκη Σχολή Θετικών Επιστημών Τμήμα Γεωλογίας και Γεωπεριβάλλοντος Περιεχόμενα Συγκέντρωση κυρίων ιόντων σε φυσικά νερά Διαγραμματική απεικόνιση

Διαβάστε περισσότερα

Εισαγωγη στην html. Η δομή μιας ιστοσελίδας (αρχείο html) Η βασική δομή ενός αρχείου html είναι η εξής: <html> <head>

Εισαγωγη στην html. Η δομή μιας ιστοσελίδας (αρχείο html) Η βασική δομή ενός αρχείου html είναι η εξής: <html> <head> Εισαγωγη στην html Ο παγκόσμιος ιστός (αγγ.: World Wide Web ή www) είναι η πιο δημοφιλής υπηρεσία που μας παρέχει το Διαδίκτυο (Internet) και είναι ένα σύστημα διασυνδεδεμένων πληροφοριών (κειμένου, εικόνας,

Διαβάστε περισσότερα

<HTML> <HEAD> <TITLE> <BODY>

<HTML> <HEAD> <TITLE> <BODY> ΑΣΚΗΣΗ 1 1. Ανοίξτε τον επεξεργαστή ιστοσελίδων 2. Αποθηκεύστε στο X:/mathimata/html/askiseis/ με όνομα askisi1b.html 3. Θα φτιάξουμε μια νέα ιστοσελίδα, χρησιμοποιώντας τις βασικές ετικέτες

Διαβάστε περισσότερα

7-22 Οκτωβρίου Μία γιορτή δημιουργίας με κώδικα. Europe Code Week

7-22 Οκτωβρίου Μία γιορτή δημιουργίας με κώδικα. Europe Code Week 7-22 Οκτωβρίου 2017 Μία γιορτή δημιουργίας με κώδικα @ #codeeu codeeu 7-22 October 2017 Europe Code Week Εισαγωγή στο Web Development HTML Λίγα λόγια... Η HTML είναι η βασική γλώσσα γραφής των ιστοσελίδων!

Διαβάστε περισσότερα

Τεχνολογίες Διαδικτύου - Εργαστήριο 1 ο

Τεχνολογίες Διαδικτύου - Εργαστήριο 1 ο Τεχνολογίες Διαδικτύου - Εργαστήριο 1 ο 1. Δημιουργία μιας απλής σελίδας HTML Στον προσωπικό σας κατάλογο δημιουργήστε ένα φάκελο με όνομα HTML. Ανοίξτε το Notepad ακολουθώντας τη διαδρομή (Start All Programs

Διαβάστε περισσότερα

Εργαλεία Ανάπτυξης Εφαρμογών Internet. Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής

Εργαλεία Ανάπτυξης Εφαρμογών Internet. Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής Εργαλεία Ανάπτυξης Εφαρμογών Internet Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής Το πρότυπο CSS Α Μέρος 2 CSS (Cascading Style Sheets)(1) Ορίζουν την εμφάνιση των στοιχείων σε ένα έγγραφο HTML.

Διαβάστε περισσότερα

Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I

Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I Διαδικτυακή Εφαρμογή (1/2) Ως διαδικτυακή εφαρμογή μπορούμε

Διαβάστε περισσότερα

Α ΛΥΚΕΙΟΥ - ΕΦΑΡΜΟΓΕΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΜΑΪΟΣ 2019 ΕΝΔΕΙΚΤΙΚΕΣ ΕΡΩΤΗΣΕΙΣ ΚΑΤΑΝΟΗΣΗΣ

Α ΛΥΚΕΙΟΥ - ΕΦΑΡΜΟΓΕΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΜΑΪΟΣ 2019 ΕΝΔΕΙΚΤΙΚΕΣ ΕΡΩΤΗΣΕΙΣ ΚΑΤΑΝΟΗΣΗΣ Το υλικό αυτό δίνεται στους μαθητές για τη σωστή μελέτη της διδαχθείσας ύλης του μέρους Β. Πρόκειται για ένα συμπαγή κορμό ερωτήσεων και ασκήσεων οι οποίες καλύφθηκαν κατά τη διάρκεια της έως τώρα σχολικής

Διαβάστε περισσότερα

Κεφάλαιο 4 HyperText Markup Language - HTML. Προγραμματιστικά εργαλεία για το διαδίκτυο Φίλιππος Κουτσάκας, Πολύγυρος 2013

Κεφάλαιο 4 HyperText Markup Language - HTML. Προγραμματιστικά εργαλεία για το διαδίκτυο Φίλιππος Κουτσάκας, Πολύγυρος 2013 Κεφάλαιο 4 HyperText Markup Language - HTML Προγραμματιστικά εργαλεία για το διαδίκτυο Φίλιππος Κουτσάκας, Πολύγυρος 2013 Τι είναι η HTML; Ένας τρόπος για να πεις στον σελιδομετρητή πώς να αναπαραστήσει

Διαβάστε περισσότερα

Παρουσίαση και μορφοποίηση κειμένου

Παρουσίαση και μορφοποίηση κειμένου HTML [ετικέτες] Παρουσίαση και μορφοποίηση κειμένου Στην HTML σύμφωνα με τους κανόνες, κενές γραμμές και περισσότερα του ενός κενά μεταξύ λέξεων δεν λαμβάνονται υπόψη από τον φυλλομετρητή. Για αυτό το

Διαβάστε περισσότερα

Cascading Style Sheets (CSS)

Cascading Style Sheets (CSS) Cascading Style Sheets (CSS) Τα Cascading Style Sheets προσφέρουν έναν εύκολο τρόπο για να ορίσουμε τη μορφοποίηση που επιθυμούμε να έχουν οι σελίδες μία τοποθεσίας του Παγκόσμιου Ιστού που δημιουργούμε.

Διαβάστε περισσότερα

Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς

Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς 3.3.1.1 Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς Γραμματοσειρές Η λέξη γραμματοσειρά αναφέρεται στο στυλ που εμφανίζονται τα γράμματα. Παρακάτω ακολουθούν κάποια παραδείγματα,

Διαβάστε περισσότερα

ΕΙΔΙΚΟΙ ΧΑΡΑΚΤΗΡΕΣ ΧΑΡΑΚΤΗΡΕΣ ΜΕ ΕΙΔΙΚΕΣ ΛΕΙΤΟΥΡΓΙΕΣ. ΠΙΝΑΚΑΣ ΚΩΔΙΚΩΝ ΔΙΑΦΥΓΗΣ Χαρακτήρας Κωδικός διαφυγής Ερμηνεία Συμβόλου & nbsp;

ΕΙΔΙΚΟΙ ΧΑΡΑΚΤΗΡΕΣ ΧΑΡΑΚΤΗΡΕΣ ΜΕ ΕΙΔΙΚΕΣ ΛΕΙΤΟΥΡΓΙΕΣ. ΠΙΝΑΚΑΣ ΚΩΔΙΚΩΝ ΔΙΑΦΥΓΗΣ Χαρακτήρας Κωδικός διαφυγής Ερμηνεία Συμβόλου & nbsp; ΕΙΔΙΚΟΙ ΧΑΡΑΚΤΗΡΕΣ Υπάρχουν ειδικοί χαρακτήρες που δεν μπορούν να απεικονισθούν με απλές πληκτρολογήσεις (πατώντας ένα πλήκτρο ή ένα πλήκτρο και το Shift) αλλά μόνο με πιο περίπλοκους τρόπους (π.χ. πατώντας

Διαβάστε περισσότερα

<a href="http://www.somepage.com/somepage.html">μετάβαση στο κείμενο</a>.

<a href=http://www.somepage.com/somepage.html>μετάβαση στο κείμενο</a>. HTML Τα αρχεία της HTML έχουν ετικέτες (tags) που ορίζουν τη δομή και τη μορφοποίηση των ιστοσελίδων. Οι περισσότερες HTML ετικέτες τις συναντούμε ως ζεύγη τα οποία ενεργούν στα περιεχόμενα μεταξύ των

Διαβάστε περισσότερα

Νέες Τεχνολογίες στην Εκπαίδευση

Νέες Τεχνολογίες στην Εκπαίδευση Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Μορφοποίηση κειμένου Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης Το παρόν εκπαιδευτικό

Διαβάστε περισσότερα

Ετικέτες HTML. <!-->: Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον

Ετικέτες HTML. <!-->: Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον Ετικέτες HTML : Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον πηγαίο κώδικα για να διευκολύνουμε την επεξεργασία και την συντήρηση του αρχείου. Τα σχόλια δεν εμφανίζονται στην οθόνη

Διαβάστε περισσότερα

CSS 3. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών

CSS 3. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών CSS 3 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης

Διαβάστε περισσότερα

Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II

Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II Εισαγωγή Εικόνων Οι φυλλομετρητές μπορούν να εμφανίσουν ένθετες

Διαβάστε περισσότερα

Βαρβάκειο Πρότυπο Γυμνάσιο

Βαρβάκειο Πρότυπο Γυμνάσιο Παραδόσεις & εργαστηριακές ασκήσεις στην HTML Βαρβάκειο Πρότυπο Γυμνάσιο Σχολ. Χρονιά 2016-2017 Θ. Οτζάκογλου Εργαστήρι Πληροφορικής Σχολ. Έτος 2016 2017 Αν και δεν είναι μία ακόμη «γλώσσα προγραμματισμού»,

Διαβάστε περισσότερα

Περιεχόμενα. Λίγα λόγια από το συγγραφέα... 7

Περιεχόμενα. Λίγα λόγια από το συγγραφέα... 7 Περιεχόμενα Λίγα λόγια από το συγγραφέα... 7 Μέρος 1 1 Βασικοί όροι... 11 2 Βασική δομή κώδικα HTML... 25 3 Μορφοποίηση κειμένου... 39 4 Μορφοποίηση παραγράφων... 51 5 Εισαγωγή εικόνας... 63 6 Λίστες με

Διαβάστε περισσότερα

ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ

ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ Βαγγελιώ Καβακλή Τμήμα Πολιτισμικής Τεχνολογίας & Επικοινωνίας 8 Μαρτίου 2001 Hypertext Markup Language (HTML)! Σε μια ιστοσελίδα μπορούν να εμφανίζονται διαφορετικά

Διαβάστε περισσότερα

Σχεδιασμός και Ανάπτυξη Ιστοτόπων. ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος

Σχεδιασμός και Ανάπτυξη Ιστοτόπων. ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος Σχεδιασμός και Ανάπτυξη Ιστοτόπων ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος H γλώσσα HTML Άλλες Βιβλιογραφικές πηγές για HTML http://www.w3schools.com/html/ http://www.it.uom.gr/project/html2/lessons.html

Διαβάστε περισσότερα

Άσκηση 6 Επαναληπτική Άσκηση HTML

Άσκηση 6 Επαναληπτική Άσκηση HTML Άσκηση 6 Επαναληπτική Άσκηση HTML ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει τον τύπο του αρχείου Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο

Διαβάστε περισσότερα

Εισαγωγή στο πρόγραμμα Microsoft word 2003

Εισαγωγή στο πρόγραμμα Microsoft word 2003 Εισαγωγή στο πρόγραμμα Microsoft word 2003 Έναρξη 1. Εκκίνηση του προγράμματος Για να ξεκινήσουμε το Word, πατάμε στο κουμπί Εναρξη και από το μενού που εμφανίζεται επιλέγουμε Προγράμματα και Microsoft

Διαβάστε περισσότερα

Σχεδίαση ιστοσελίδων

Σχεδίαση ιστοσελίδων Τ.Ε.Ι. Δυτικής Ελλάδας Σχολή Διοίκησης και Οικονομίας Τμήμα Διοίκησης Επιχειρήσεων - Πάτρα Σχεδίαση ιστοσελίδων Θεώνη Πιτουρά, Γιάννης Κουτσονίκος Σημειώσεις για το Εργαστήριο «Επιχειρηματικές δικτυακές

Διαβάστε περισσότερα

Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου.

Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου. Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου. 1 η ΑΣΚΗΣΗ Οι HTML σελίδες είναι απλές σελίδες κειμένου και μπορούν να δημιουργηθούν από οποιοδήποτε πρόγραμμα επεξεργασίας

Διαβάστε περισσότερα

CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML

CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML Εισαγωγή Το CSS (Cascading Style Sheets ή Επικαλυπτόμενα Φύλλα Στυλ) μας επιτρέπει να αλλάξουμε τον τρόπο με τον οποίο παρουσιάζονται τα στοιχεία

Διαβάστε περισσότερα

( Απάντηση: Ο τόνος βρίσκεται δεξιά από το γράμμα Λ. ) ( Απάντηση: Κρατάμε πατημένο το πλήκτρο Shift και πατάμε το πλήκτρο 8. )

( Απάντηση: Ο τόνος βρίσκεται δεξιά από το γράμμα Λ. ) ( Απάντηση: Κρατάμε πατημένο το πλήκτρο Shift και πατάμε το πλήκτρο 8. ) 1 Επεξεργασία Κειμένου OpenOffice writer Απόσπασμα Μάθημα: Γλώσσα, Τάξη: Δ Ενότητα 2: «Ρώτα το νερό τι τρέχει» Θυμόμαστε: Ποιο πλήκτρο είναι ο τόνος; ( Απάντηση: Ο τόνος βρίσκεται δεξιά από το γράμμα Λ.

Διαβάστε περισσότερα

Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML

Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο για το αρχείο Ορίζει το σώµα της background URL

Διαβάστε περισσότερα

Σπουδές CAD, Πληροφορικής, Οικονομίας, Διοίκησης και D.T.P. με Σύστημα διδασκαλίας facetoface

Σπουδές CAD, Πληροφορικής, Οικονομίας, Διοίκησης και D.T.P. με Σύστημα διδασκαλίας facetoface Copyright 2009-2012 -SYSTEM- All rights reserved 2/159 ΠΕΡΙΕΧΟΜΕΝΑ Μάθημα 1: New - Save Μάθημα 2: Εισαγωγή στη CSS Μάθημα 3: Τρόπος Σύνταξης Μάθημα 4: Σχόλια Μάθημα 5: ID Μάθημα 6: Class Μάθημα 7: Background

Διαβάστε περισσότερα

Επεξεργαστής Κειμένου: (Microsoft Word)

Επεξεργαστής Κειμένου: (Microsoft Word) Επεξεργαστής Κειμένου: (Microsoft Word) Στο περιβάλλον εργασίας του επεξεργαστή κειμένου Microsoft Word εκτελούμε τις παρακάτω λειτουργίες: 1) Δημιουργία Νέου Εγγράφου: Η Δημιουργία ενός Νέου Εγγράφου

Διαβάστε περισσότερα

Ποιες είναι οι κύριες ετικέτες που χρησιμοποιεί η HTML για την περιγραφή της συνολικής δομής μιας ιστοσελίδας;

Ποιες είναι οι κύριες ετικέτες που χρησιμοποιεί η HTML για την περιγραφή της συνολικής δομής μιας ιστοσελίδας; Τι είναι η HTML; Η HTML είναι το ακρωνύμιο των λέξεων HyperText Markup Language, δηλαδή Γλώσσα Χαρακτηρισμού Υπερ Κειμένου και βασίζεται στη γλώσσα SGML, Standard Generalized Markup Language, που είναι

Διαβάστε περισσότερα

Σύνθετη αναζήτηση ΒΙΒΛΙΑ ΣΥΓΓΡΑΦΕΙΣ ΕΚΠΑΙΔΕΥΤΙΚΟΙ ΒΙΒΛΙΟΠΩΛΕΣ ΥΠΗΡΕΣΙΕΣ ΕΤΑΙΡΙΑ. Tips για αποτελεσματική αναζήτηση

Σύνθετη αναζήτηση ΒΙΒΛΙΑ ΣΥΓΓΡΑΦΕΙΣ ΕΚΠΑΙΔΕΥΤΙΚΟΙ ΒΙΒΛΙΟΠΩΛΕΣ ΥΠΗΡΕΣΙΕΣ ΕΤΑΙΡΙΑ. Tips για αποτελεσματική αναζήτηση ΣΥΓΓΡΑΦΕΙΣ > Συγγραφείς παιδικών & νεανικών βιβλίων Σύνθετη αναζήτηση Tips για αποτελεσματική αναζήτηση Duis aute irure dolor in henderit. Sed ut perspiciatis unde omnis iste natus error sit voluptatem

Διαβάστε περισσότερα

Πρακτικές συμβουλές κατά την πληκτρολόγηση ., ; :! ( ) " " Άνοιγμα και αποθήκευση εγγράφου Αρχείο, Άνοιγμα. Αρχείο / Αποθήκευση

Πρακτικές συμβουλές κατά την πληκτρολόγηση ., ; :! ( )   Άνοιγμα και αποθήκευση εγγράφου Αρχείο, Άνοιγμα. Αρχείο / Αποθήκευση Επεξεργαστής κειμένου Word 2003 Πρακτικές συμβουλές κατά την πληκτρολόγηση Για να αλλάξουμε παράγραφο πατάμε Enter. Για να αφήσουμε μία κενή γραμμή, πατάμε μία φορά το Enter. Για να γράψουμε την επόμενη

Διαβάστε περισσότερα

Άσκηση 5 Firefox Αποθήκευση αρχείων

Άσκηση 5 Firefox Αποθήκευση αρχείων Άσκηση 5 Firefox Αποθήκευση αρχείων Παρουσίαση Γραμμών Εργαλείων Ανοίγουμε τον περιηγητή ιστού Firefox. Αποθήκευση εικόνων Ανοίγουμε την σελίδα www.google.gr Στην πάνω αριστερά γωνία κάνουμε αριστερό κλικ

Διαβάστε περισσότερα

Θέματα Προγραμματισμού Διαδικτύου ~ CSS ~

Θέματα Προγραμματισμού Διαδικτύου ~ CSS ~ Θέματα Προγραμματισμού Διαδικτύου ~ CSS ~ Στελιος Σφακιανάκης Εαρινό 2019 Αυτή η εργασία χορηγείται με άδεια Creative Commons Αναφορά Δημιουργού - Μη Εμπορική Χρήση - Παρόμοια Διανομή 1 Εισαγωγή στο CSS

Διαβάστε περισσότερα

ΥΠΗΡΕΣΙΕΣ ΔΙΑΔΙΚΤΟΥ Explorer & Outlook 2013

ΥΠΗΡΕΣΙΕΣ ΔΙΑΔΙΚΤΟΥ Explorer & Outlook 2013 ΥΠΗΡΕΣΙΕΣ ΔΙΑΔΙΚΤΟΥ Explorer & Outlook 2013 1. Δίκτυα Υπολογιστών και Διαδίκτυο... 3 1.1. Όροι Και Έννοιες... 3 1.2. Ασφάλεια Στο Διαδίκτυο... 5 2. Περιήγηση στον Παγκόσμιο Ιστό 7 Το Περιβάλλον Ενός Φυλλομετρητή...

Διαβάστε περισσότερα

Κεφάλαιο 1 Χρήση προτύπου 2. Κεφάλαιο 2 Τροποποίηση μιας παρουσίασης 9. Κεφάλαιο 4 Προσθήκη αντικειμένων 26. Κεφάλαιο 5 Ειδικά εφέ 35

Κεφάλαιο 1 Χρήση προτύπου 2. Κεφάλαιο 2 Τροποποίηση μιας παρουσίασης 9. Κεφάλαιο 4 Προσθήκη αντικειμένων 26. Κεφάλαιο 5 Ειδικά εφέ 35 Περιεχόμενα Κεφάλαιο 1 Χρήση προτύπου 2 Κεφάλαιο 2 Τροποποίηση μιας παρουσίασης 9 Κεφάλαιο 3 Εφαρμογή σχεδίων 19 Κεφάλαιο 4 Προσθήκη αντικειμένων 26 Κεφάλαιο 5 Ειδικά εφέ 35 Κεφάλαιο 6 Κουμπιά ενεργειών

Διαβάστε περισσότερα

Εργαστήριο Εφαρμοσμένης Πληροφορικής

Εργαστήριο Εφαρμοσμένης Πληροφορικής Τμήμα Φυσικής - Αριστοτέλειο Πανεπιστήμιο Θεσσαλονίκης Εργαστήριο Εφαρμοσμένης Πληροφορικής Ομάδα Α. Προετοιμασία Αναφοράς Εργασία-2: Σύνθεση αναφοράς Σύνθεση Αναφοράς http://eep.physics.auth.gr Τι περιέχει

Διαβάστε περισσότερα

Εισαγωγή στο Word. Κεντρική οθόνη του Word

Εισαγωγή στο Word. Κεντρική οθόνη του Word Εισαγωγή στο Word Το Word είναι το δημοφιλέστερο πρόγραμμα επεξεργασίας κειμένου. Τα κύρια χαρακτηριστικά του είναι η εύκολη και γρήγορη δημιουργία και επεξεργασία εγγράφων. Κεντρική οθόνη του Word Το

Διαβάστε περισσότερα

Ref.: SLWS 1 5Copyright 2005 The European Computer Driving Licence Foundation Ltd Σελίδα 1 από 7

Ref.: SLWS 1 5Copyright 2005 The European Computer Driving Licence Foundation Ltd Σελίδα 1 από 7 The European Computer Driving Licence Foundation Ltd Σελίδα 1 από 7 ΣΤΟΧΟΙ ΕΞΕΤΑΣΗΣ Η ενότητα ECDL WebStarter απαιτεί από τον Υποψήφιο να κατανοεί τις κύριες έννοιες της σχεδίασης και δημοσίευσης δικτυακών

Διαβάστε περισσότερα

Δημιουργία ενός κενού πίνακα

Δημιουργία ενός κενού πίνακα 3.4.1.1 Δημιουργία ενός κενού πίνακα Ένας πίνακας αποτελείται από έναν αριθμό γραμμών και στηλών που δημιουργούν ένα πλέγμα. Σε αυτό το πλέγμα είναι πιθανή η ύπαρξη ή μη περιθωρίων. Κάθε κελί του πίνακα

Διαβάστε περισσότερα

Άσκηση 3 -Δηµιουργία ιστοσελίδων µε HTML µέρος 3 ο

Άσκηση 3 -Δηµιουργία ιστοσελίδων µε HTML µέρος 3 ο Άσκηση 3 -Δηµιουργία ιστοσελίδων µε HTML µέρος 3 ο Εικόνες στην HTML Oι εικόνες ορίζονται µε την ετικέτα . Η συγκεκριµένη ετικέτα δεν κλείνει (είναι λάθος το: ) ή µπορούµε να πούµε ότι ανοίγει

Διαβάστε περισσότερα

Διάλεξη 2η Εισαγωγή στο CSS

Διάλεξη 2η Εισαγωγή στο CSS Διάλεξη 2η Εισαγωγή στο CSS Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e c o d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Τι είναι το CSS? Γιατί να χρησιμοποιήσω

Διαβάστε περισσότερα

Περιεχόμενα. Γαβαλάς Δαμιανός

Περιεχόμενα. Γαβαλάς Δαμιανός Δικτυακά Πολυμέσα ΙΙ Διάλεξη #5 η : Τυπογραφία στο web Γαβαλάς Δαμιανός dgavalas@aegean.gr Περιεχόμενα Κατανόηση αρχών σχεδιασμού με γραμματοσειρές Κατανόηση των μονάδων μέτρησης που χρησιμοποιούνται στα

Διαβάστε περισσότερα

ΚΕΦΑΛΑΙΟ 3. Μορφοποίηση

ΚΕΦΑΛΑΙΟ 3. Μορφοποίηση Σαχπατζίδης Αβραάμ Καθηγητής Πληροφορικής Π.Ε 20 Master of Arts (M.A) in "Gender, New Forms of Education, New Forms of Employment and New Technologies in the Information Age". Μορφοποίηση ΚΕΦΑΛΑΙΟ 3 (1)

Διαβάστε περισσότερα

Στην ενότητα αυτή θα δούμε πως με CSS ιδιότητες μπορούμε να ορίσουμε μέγεθος, γραμματοσειρά και άλλα χαρακτηριστικά του κειμένου στην ιστοσελίδα μας

Στην ενότητα αυτή θα δούμε πως με CSS ιδιότητες μπορούμε να ορίσουμε μέγεθος, γραμματοσειρά και άλλα χαρακτηριστικά του κειμένου στην ιστοσελίδα μας Γραμματοσειρά Στην ενότητα αυτή θα δούμε πως με CSS ιδιότητες μπορούμε να ορίσουμε μέγεθος, γραμματοσειρά και άλλα χαρακτηριστικά του κειμένου στην ιστοσελίδα μας Γραμματοσειρά κειμένου Με την CSS ιδιότητα

Διαβάστε περισσότερα

Νέες Τεχνολογίες στην Εκπαίδευση

Νέες Τεχνολογίες στην Εκπαίδευση Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Επάλληλα φύλλα στυλ (CSS): Μια εισαγωγή Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης

Διαβάστε περισσότερα

Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή.

Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή. Εισαγωγή στο CSS Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή. Πλεονεκτήματα CSS έναντι χρήσης μόνο HTML Μεγαλύτερη ευελιξία μορφοποιήσεων. Το CSS κατέστησε

Διαβάστε περισσότερα

1 ο ΓΥΜΝΑΣΙΟ ΘΕΡΜΗΣ ΜΟΡΦΟΠΟΙΗΣΕΙΣ ΜΟΡΦΟΠΟΙΗΣΕΙΣ ΧΑΡΑΚΤΗΡΩΝ. Μάθημα: Πληροφορική Α' Γυμν. Ενότητα: Επεξεργασία κειμένου

1 ο ΓΥΜΝΑΣΙΟ ΘΕΡΜΗΣ ΜΟΡΦΟΠΟΙΗΣΕΙΣ ΜΟΡΦΟΠΟΙΗΣΕΙΣ ΧΑΡΑΚΤΗΡΩΝ. Μάθημα: Πληροφορική Α' Γυμν. Ενότητα: Επεξεργασία κειμένου 1 ο ΓΥΜΝΑΣΙΟ ΘΕΡΜΗΣ Μάθημα: Πληροφορική Α' Γυμν. Ενότητα: Επεξεργασία κειμένου ΜΟΡΦΟΠΟΙΗΣΕΙΣ Τα κυριότερα είδη μορφοποιήσεων είναι: Μορφοποιήσεις Χαρακτήρων Μορφοποιήσεις Παραγράφων Οι Μορφοποιήσεις Χαρακτήρων

Διαβάστε περισσότερα

Εργαστηριακή Άσκηση 4 Μορφοποίηση Κειμένου μέσω του

Εργαστηριακή Άσκηση 4 Μορφοποίηση Κειμένου μέσω του Μορφοποίηση χαρακτήρων Όταν ανοίγουμε το Word η γραμματοσειρά που υπάρχει είναι προκαθορισμένη. Το πλαίσιο διαλόγου Γραμματοσειρά μας επιτρέπει να κάνουμε περισσότερες μορφοποιήσεις. Επιλέγουμε Μορφή Απόσταση

Διαβάστε περισσότερα

Οδηγίες Εγκατάστασης της εφαρμογής Readium και Readium για μαθητές με αμβλυωπία για την ανάγνωση βιβλίων epub σε Υπολογιστή.

Οδηγίες Εγκατάστασης της εφαρμογής Readium και Readium για μαθητές με αμβλυωπία για την ανάγνωση βιβλίων epub σε Υπολογιστή. Οδηγίες Εγκατάστασης της εφαρμογής Readium και Readium για μαθητές με αμβλυωπία για την ανάγνωση βιβλίων epub σε Υπολογιστή. Βήμα 1 ο : Εγκατάσταση εφαρμογής ανάγνωσης Readium και Readium για μαθητές με

Διαβάστε περισσότερα

Σχεδίαση και Ανάπτυξη Ιστότοπων

Σχεδίαση και Ανάπτυξη Ιστότοπων Σχεδίαση και Ανάπτυξη Ιστότοπων HTML Καθορισμός Χρωμάτων και Γραμματοσειρών σε μια ιστοσελίδα Παρουσίαση 7 η Βελώνης Γεώργιος Καθηγητής 1 Σημασία συμβόλων HTML5 tags. Obsolete tags: Μην αφήνετε αυτές τις

Διαβάστε περισσότερα

ΟΔΗΓΙΕΣ ΚΕΙΜΕΝΟΓΡΑΦΟΥ 2007

ΟΔΗΓΙΕΣ ΚΕΙΜΕΝΟΓΡΑΦΟΥ 2007 1. ΓΡΑΜΜΗ ΜΕΝΟΥ ΟΔΗΓΙΕΣ ΚΕΙΜΕΝΟΓΡΑΦΟΥ 2007 2. ΓΡΑΜΜΗ ΕΡΓΑΛΕΙΩΝ Κάθε μενού έχει τις δικές της δυνατότητες, όπως για παράδειγμα μόλις πατήσετε το κουμπί κεντρική βγαίνουν τα εικονίδια των δυνατοτήτων που

Διαβάστε περισσότερα

Εισαγωγή στον Παγκόσμιο ιστό και στη γλώσσα Html. Χρ. Ηλιούδης

Εισαγωγή στον Παγκόσμιο ιστό και στη γλώσσα Html. Χρ. Ηλιούδης Εισαγωγή στον Παγκόσμιο ιστό και στη γλώσσα Html Χρ. Ηλιούδης Παγκόσμιος Ιστός (WWW) Ο Παγκόσμιος Ιστός (World Wide Web WWW), ή απλώς Ιστός, βασίζεται στην ιδέα των κατανεμημένων πληροφοριών. Αντί όλες

Διαβάστε περισσότερα

Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας

Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας µέσω της τεχνολογίας των ιαδοχικών Φύλλων Στυλ (cascading

Διαβάστε περισσότερα

Πρακτικές οδηγίες για την Επεξεργασία Κειμένου

Πρακτικές οδηγίες για την Επεξεργασία Κειμένου 11 Εργαλεία έκφρασης και δημιουργίας Επεξεργασία Κειμένου Α Γυμνασίου Πρακτικές οδηγίες για την Επεξεργασία Κειμένου Ένα πρόγραμμα επεξεργασίας κειμένου μας προσφέρει τη δυνατότητα να: προσθέτουμε, να

Διαβάστε περισσότερα

Εισαγωγή στο Libre Office. Bάιος Κολοφωτιάς Επιστημονικός Συνεργάτης Sweng Lab A.Π.Θ

Εισαγωγή στο Libre Office. Bάιος Κολοφωτιάς Επιστημονικός Συνεργάτης Sweng Lab A.Π.Θ Εισαγωγή στο Libre Office Bάιος Κολοφωτιάς Επιστημονικός Συνεργάτης Sweng Lab A.Π.Θ Εισαγωγή στο Libre Ofiice To LibreOffice είναι η ελεύθερη, πολυδύναμη (power-packed), σουΐτα προσωπικής παραγωγικότητας

Διαβάστε περισσότερα

CSS. Εισαγωγή & Βασικές έννοιες. Cascading Style Sheets. Επικαλυπτόμενα φύλλα στυλ

CSS. Εισαγωγή & Βασικές έννοιες. Cascading Style Sheets. Επικαλυπτόμενα φύλλα στυλ CSS Εισαγωγή & Βασικές έννοιες Cascading Style Sheets Επικαλυπτόμενα φύλλα στυλ Περιεχόμενα Τι είναι CSS Πλεονεκτήματα CSS μορφοποίησης Συντακτικό του CSS Ιδιότητες CSS Εφαρμογή CSS κανόνων Επικάλυψη CSS

Διαβάστε περισσότερα

ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ ΤΕΧΝΟΛΟΓΙΚΟ ΕΚΠΑΙΔΕΥΤΙΚΟ ΙΔΡΥΜΑ ΙΟΝΙΩΝ ΝΗΣΩΝ ΠΑΡΑΡΤΗΜΑ ΛΕΥΚΑΔΑΣ ΤΜΗΜΑ ΔΙΟΙΚΗΣΗΣ ΕΠΙΧΕΙΡΗΣΕΩΝ ΤΙΤΛΟΣ ΕΡΓΑΣΙΑΣ

ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ ΤΕΧΝΟΛΟΓΙΚΟ ΕΚΠΑΙΔΕΥΤΙΚΟ ΙΔΡΥΜΑ ΙΟΝΙΩΝ ΝΗΣΩΝ ΠΑΡΑΡΤΗΜΑ ΛΕΥΚΑΔΑΣ ΤΜΗΜΑ ΔΙΟΙΚΗΣΗΣ ΕΠΙΧΕΙΡΗΣΕΩΝ ΤΙΤΛΟΣ ΕΡΓΑΣΙΑΣ ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ ΤΕΧΝΟΛΟΓΙΚΟ ΕΚΠΑΙΔΕΥΤΙΚΟ ΙΔΡΥΜΑ ΙΟΝΙΩΝ ΝΗΣΩΝ ΠΑΡΑΡΤΗΜΑ ΛΕΥΚΑΔΑΣ ΤΜΗΜΑ ΔΙΟΙΚΗΣΗΣ ΕΠΙΧΕΙΡΗΣΕΩΝ ΤΙΤΛΟΣ ΕΡΓΑΣΙΑΣ ΕΡΓΑΣΙΑ ΓΙΑ ΤΟ ΜΑΘΗΜΑ ΟΝΟΜΑ ΜΑΘΗΜΑΤΟΣ ΕΚΠΟΝΗΘΗΚΕ ΑΠΟ ΤΟΝ/ΤΗΝ/ΤΟΥΣ ΟΝΟΜΑΤΕΠΩΝΥΜΟ

Διαβάστε περισσότερα

TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)

TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί

Διαβάστε περισσότερα

Σχεδιασμός και Ανάπτυξη Ιστότοπων

Σχεδιασμός και Ανάπτυξη Ιστότοπων Σχεδιασμός και Ανάπτυξη Ιστότοπων CSS: Ιδιότητες μορφοποίησης κειμένου Παρουσίαση 14 η 1 Βελώνης Γεώργιος Καθηγητής Browsers δοκιμών Οι δοκιμές έγιναν στους παρακάτω browsers και εκδόσεις τους: Google

Διαβάστε περισσότερα

1. Ξεκινήστε το πρόγραµµα Επεξεργασίας Κειµένου. 2. Αλλάξτε την Προβολή σε ιάταξη εκτύπωσης. 3. Αλλάξτε το Ζουµ προβολής σε Πλάτος σελίδας

1. Ξεκινήστε το πρόγραµµα Επεξεργασίας Κειµένου. 2. Αλλάξτε την Προβολή σε ιάταξη εκτύπωσης. 3. Αλλάξτε το Ζουµ προβολής σε Πλάτος σελίδας 1. Ξεκινήστε το πρόγραµµα Επεξεργασίας Κειµένου 2. Αλλάξτε την Προβολή σε ιάταξη εκτύπωσης 3. Αλλάξτε το Ζουµ προβολής σε Πλάτος σελίδας 4. Εµφανίστε τη γραµµή εργαλείων Σχεδίαση 5. Πληκτρολογήστε το κείµενο

Διαβάστε περισσότερα

ΑΣΠΑΙΤΕ. ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ 4α. Υπερκείμενο και HTML. Ημερομηνία :... Τμήμα :... Ονοματεπώνυμο :...

ΑΣΠΑΙΤΕ. ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ 4α. Υπερκείμενο και HTML. Ημερομηνία :... Τμήμα :... Ονοματεπώνυμο :... ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ 4α Υπερκείμενο και HTML ΑΣΠΑΙΤΕ Ημερομηνία :... Τμήμα :... Ονοματεπώνυμο :... Η HTML (HyperText Markup Language) είναι η γλώσσα που χρησιμοποιείται για να περιγράψει τη δομή και τη διαμόρφωση

Διαβάστε περισσότερα

Στην τεχνολογία των CSS, οι κανόνες στυλ (style

Στην τεχνολογία των CSS, οι κανόνες στυλ (style Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #4 0 : CSS: Βασικές και προχωρημένες τεχνικές επιλογής, τα στοιχεία και , ψευδο κλάσεις και ψευδο επιλογείς Γαβαλάς Δαμιανός dgavalas@aegean.gr CSS κανόνες στυλ

Διαβάστε περισσότερα

Εγχειρίδιο Συμμετοχής σε Ψηφοφορία για την ανάδειξη Διευθυντή Σχολής ΤΕΙ ΑΘΗΝΑΣ 2014

Εγχειρίδιο Συμμετοχής σε Ψηφοφορία για την ανάδειξη Διευθυντή Σχολής ΤΕΙ ΑΘΗΝΑΣ 2014 Εγχειρίδιο Συμμετοχής σε Ψηφοφορία για την ανάδειξη Διευθυντή Σχολής ΤΕΙ ΑΘΗΝΑΣ 2014 Ο ψηφοφόρος λαμβάνει στην ηλεκτρονική του διεύθυνση μήνυμα όπως το παρακάτω με το οποίο καλείται να ψηφίσει. Το μήνυμα

Διαβάστε περισσότερα

Βήμα 1: Γενικά στοιχεία της εργασίας και υπεύθυνος επικοινωνίας

Βήμα 1: Γενικά στοιχεία της εργασίας και υπεύθυνος επικοινωνίας 1 Γενικές Οδηγίες Βήμα 1: Γενικά στοιχεία της εργασίας και υπεύθυνος επικοινωνίας Βήμα 2: Τίτλος και κείμενο εργασίας Βήμα 3: Συγγραφείς Βήμα 4: Προεπισκόπηση εργασίας και υποβολή 2 Σε περίπτωση που δεν

Διαβάστε περισσότερα

Η λίστα <ol> (ordered list)

Η λίστα <ol> (ordered list) Λίστες (lists) Σε πολλά έγγραφα απαιτείται η παρουσίαση ή η καταγραφή στοιχείων σε μορφή λίστας. Για παράδειγμα, μια λίστα από ονόματα ή μια λίστα από προϊόντα. Τα στοιχεία μιας λίστας μπορεί να είναι

Διαβάστε περισσότερα

Δημιουργία. Ιστολογίου (blog) 7/5/2015. Χρυσάνθη Γιομέλου ΚΔΒΜ ΝΙΚΑΙΑΣ

Δημιουργία. Ιστολογίου (blog)  7/5/2015. Χρυσάνθη Γιομέλου ΚΔΒΜ ΝΙΚΑΙΑΣ Δημιουργία 7/5/2015 Ιστολογίου (blog) www.blogger.com Χρυσάνθη Γιομέλου ΚΔΒΜ ΝΙΚΑΙΑΣ ΠΕΡΙΕΧΟΜΕΝΑ TI EINAI TO ΙΣΤΟΛΟΓΙΟ... 2 ΓΙΑΤΙ ΙΣΤΟΛΟΓΙΟ;... 2 ΠΛΕΟΝΕΚΤΗΜΑΤΑ ΤΗΣ ΧΡΗΣΗΣ ΙΣΤΟΛΟΓΙΟΥ... 2 ΔΗΜΙΟΥΡΓΙΑ ΛΟΓΑΡΙΑΣΜΟΥ

Διαβάστε περισσότερα

Οδηγός γρήγορης εκκίνησης

Οδηγός γρήγορης εκκίνησης Οδηγός γρήγορης εκκίνησης Το Microsoft Word 2013 έχει διαφορετική εμφάνιση από προηγούμενες εκδόσεις. Γι αυτό το λόγο, δημιουργήσαμε αυτόν τον οδηγό για να ελαχιστοποιήσουμε την καμπύλη εκμάθησης. Γραμμή

Διαβάστε περισσότερα

ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ. Κειμενογράφος WORD

ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ. Κειμενογράφος WORD ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ Κειμενογράφος WORD ΣΚΟΠΟΣ Η ανάπτυξη δεξιοτήτων επεξεργασίας κειμένου ΠΡΟΤΑΣΕΙΣ ΚΑΙ ΡΥΘΜΙΣΕΙΣ Άνω περιθώριο (top margin) : 2.49cm Κάτω περιθώριο (bottom margin) :5.99cm Αριστερό περιθώριο

Διαβάστε περισσότερα

Σε αυτή τη σειρά διαφανειών θα παρουσιαστούν πρακτικά θέματα σχεδίασης μίας ιστοσελίδας που περιέχει css.

Σε αυτή τη σειρά διαφανειών θα παρουσιαστούν πρακτικά θέματα σχεδίασης μίας ιστοσελίδας που περιέχει css. Σε αυτή τη σειρά διαφανειών θα παρουσιαστούν πρακτικά θέματα σχεδίασης μίας ιστοσελίδας που περιέχει css. 1 Σε αυτή τη σειρά διαφανειών αρχικά θα αναφερθούμε στην επιλογή χρώματος σχεδίασης και τους συνήθεις

Διαβάστε περισσότερα

Microsoft Excel Κεφάλαιο 1. Εισαγωγή. Βιβλίο εργασίας

Microsoft Excel Κεφάλαιο 1. Εισαγωγή. Βιβλίο εργασίας Περιεχόμενα Κεφάλαιο 1 Microsoft Excel 2010... 7 Κεφάλαιο 2 Η δομή ενός φύλλου εργασίας... 19 Κεφάλαιο 3 ημιουργία νέου βιβλίου εργασίας και καταχώριση δεδομένων... 24 Κεφάλαιο 4 Συμβουλές για την καταχώριση

Διαβάστε περισσότερα

HTML Εργαστήριο 1.1 Μάθημα (Ορισμός εικόνας ως φόντου - Μορφοποιήσεις κειμένου Λίστες)

HTML Εργαστήριο 1.1 Μάθημα (Ορισμός εικόνας ως φόντου - Μορφοποιήσεις κειμένου Λίστες) HTML Εργαστήριο 1.1 Μάθημα (Ορισμός εικόνας ως φόντου - Μορφοποιήσεις κειμένου Λίστες) Ορισμός εικόνας ως φόντου 1. Για να ορίσουμε σαν φόντο μια εικόνα, θα πρέπει να βάλουμε την εικόνα στον ίδιο φάκελο

Διαβάστε περισσότερα

a. Κάνουμε κλικ στο Δημιουργία Διαφάνειας c. Ξεκινούμε να γράφουμε την διαφάνεια a. Είναι η πρώτη διαφάνεια της σειράς

a. Κάνουμε κλικ στο Δημιουργία Διαφάνειας c. Ξεκινούμε να γράφουμε την διαφάνεια a. Είναι η πρώτη διαφάνεια της σειράς PowerPoint 1. Εισαγωγή διαφάνειας a. Κάνουμε κλικ στο Δημιουργία Διαφάνειας b. Επιλέγουμε το είδος της διαφάνειας που επιθυμούμε. Η πρώτη διαφάνεια συνήθως είναι η διαφάνεια τίτλου. c. Ξεκινούμε να γράφουμε

Διαβάστε περισσότερα

Εισαγωγή στην Επιστήμη της Πληροφορικής Εργαστήριο. Microsoft Word Μέρος 1

Εισαγωγή στην Επιστήμη της Πληροφορικής Εργαστήριο. Microsoft Word Μέρος 1 Πανεπιστήμιο Κύπρου Τμήμα Πληροφορικής Εισαγωγή στην Επιστήμη της Πληροφορικής Εργαστήριο ΕΠΛ001 Εισαγωγή στην Επιστήμη της Πληροφορικής Εργαστήριο Microsoft Word Μέρος 1 Παναγιώτης Χατζηχριστοδούλου Εισαγωγή

Διαβάστε περισσότερα

Σχεδιασμός και Ανάπτυξη Ιστότοπων

Σχεδιασμός και Ανάπτυξη Ιστότοπων Σχεδιασμός και Ανάπτυξη Ιστότοπων HTML: Λίστες Παρουσίαση 8 η 1 Βελώνης Γεώργιος Καθηγητής Σημασία συμβόλων HTML5 tags. Obsolete tags: Μην αφήνετε αυτές τις ετικέτες στον κώδικά σας. Deprecated tags: Αντικαταστήστε

Διαβάστε περισσότερα

ΦΥΛΛΟ ΕΡΓΑΣΙΑΣ ΣΤΟ WORD Κοκκόρη Αθηνά

ΦΥΛΛΟ ΕΡΓΑΣΙΑΣ ΣΤΟ WORD Κοκκόρη Αθηνά 1. Πληκτρολογήστε τα παρακάτω: Καλημέρα, Χαϊδάρι, καΐκι. Που θα πας αύριο; Πάρε μαζί σου: ένα μολύβι, μια γόμα, ένα στυλό. Η έκπτωση είναι 30%. Φοβερό!!! Τόνος: Πατάω το πλήκτρο Διαλυτικά: Πατάω shift

Διαβάστε περισσότερα

Εισαγωγή σε HTML και CSS. Παναγιώτης Τσαρχόπουλος

Εισαγωγή σε HTML και CSS. Παναγιώτης Τσαρχόπουλος Εισαγωγή σε HTML και CSS Παναγιώτης Τσαρχόπουλος Περιεχόμενα Εισαγωγικές έννοιες Ορολογία και σύνταξη Κείμενο σε HTML έγγραφα Σύνδεσμοι Ψηφιακές - Ευφυείς Πόλεις - Εισαγωγή σε HTML και CSS 2 Εισαγωγικές

Διαβάστε περισσότερα

Εισαγωγή στην Επιστήμη της Πληροφορικής Εργαστήριο. Microsoft Word Μέρος 1

Εισαγωγή στην Επιστήμη της Πληροφορικής Εργαστήριο. Microsoft Word Μέρος 1 Πανεπιστήμιο Κύπρου Τμήμα Πληροφορικής Εισαγωγή στην Επιστήμη της Πληροφορικής και Πληροφοριακά Συστήματα Εργαστήριο - ΕΠΛ003 Εισαγωγή στην Επιστήμη της Πληροφορικής Εργαστήριο Microsoft Word Μέρος 1 Παναγιώτης

Διαβάστε περισσότερα