Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας

Save this PDF as:
 WORD  PNG  TXT  JPG

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

Download "Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας"

Transcript

1 Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας ικτυακά Πολυμέσα Ι (Β Έτος, 3ο εξ) ιάλεξη #6η: HTML: ετικέτες ΜΕΤΑ, Cascading Style Sheet (CSS) Γαβαλάς Δαμιανός Χειμερινό εξάμηνο Ετικέτες META 1

2 Ετικέτες METΑ Οι ετικέτες <META> της HTML δημιουργήθηκαν για να επιτρέπει την ενσωμάτωση επιπλέον πληροφοριών σε μια ιστοσελίδα που δεν εμφανίζουν οι web browsers. Οι ετικέτες αυτές περιέχονται στο τμήμα <HEAD>... </HEAD> του HTML αρχείου. Επιτρέπουν να: Προσθέσουμε επιπλέον πληροφορίες που θα κάνουν εφικτό τον εντοπισμό της σελίδας σας από τις μηχανές αναζήτησης. Σεπερίπτωσηπουησελίδαμαςέχειμετακινηθεί, ο επισκέπτης της να ανακατευθυνθεί αυτόματα στη νέα της τοποθεσία (διεύθυνση) Ετικέτες Περιγραφής (META Descriptor tags) Περιγράφουν το περιεχόμενο της σελίδας Σύνταξη μιας ετικέτας περιγραφής: <META name="description" content="this tutorial explains."> Η περιγραφή της σελίδας επιστρέφεται από τις μηχανές αναζήτησης Περιγραφή της σελίδας Αυτό το έγγραφο δεν περιλαμβάνει ετικέτα περιγραφής. Αυτό που ακολουθεί το link είναι οι πρώτες γραμμές του HTML αρχείου 2

3 Ετικέτες ΜΕΤΑ για ορισμό λέξεων-κλειδιών Άλλη μια χρήση της ετικέτας META είναι η η εισαγωγή λέξεων-κλειδιών που πιθανά να χρησιμοποιήσει κάποιος που αναζητά μια σελίδα παρόμοια με τη δική μας. Για παράδειγμα: <META name="keywords" content="html, tutorial, learn, make, create, design, web page, εγχειρίδιο, ιστοσελίδες, writing, form, tables, frames"> Ετικέτες ΜΕΤΑ για ανακατεύθυνση σε άλλη διεύθυνση Συχνά σελίδες μεταφέρονται (αναδιοργάνωση web site, π.χ. μεταφορά σε άλλο φάκελο, μεταφορά web site σε άλλο domain) Καλή πρακτική να αφήνουμε στην «παλιά διεύθυνση» μια σελίδα που να ανακατευθύνει τον επισκέπτη στη νέα διεύθυνση, μέχρι να ενημερώσει τα bookmarks του) <meta http-equiv="refresh" content="5;url= Αυτόματη μεταφορά στη νέα διεύθυνση μετά από 5 sec Εκτέλεση 3

4 Συζήτηση Σας ζητούν να υλοποιήσετε μια ιστοσελίδα που να ανανεώνεται (refresh) αυτόματα κάθε 1 min, χωρίς δηλαδή ο χρήστης να χρειαστεί να πατάει το πλήκτρο Refresh π.χ. μια σελίδα που ενημερώνει το χρήστη σε real-time για το σκορ ενός αγώνα ποδοσφαίρου που βρίσκεται σε εξέλιξη Λύση: Αν η διεύθυνση της σελίδας που πρέπει να ανανεώνεται αυτόματα είναι: της προσθέτουμε τον κώδικα: <meta http-equiv="refresh" content="60;url= pages/reload.htm"> Επικαλυπτόμενα Φύλλα Στυλ (Cascading Style Sheets) 4

5 Μορφοποίηση κειμένου με απλή HTML (Ι) Ορισμός μεγέθους γραμματοσειράς <font size=n>σώμα Κειμένου</font> Ορισμός σχετικού μεγέθους <font size=+1>σώμα Κειμένου</font> <font size=-2>σώμα Κειμένου</font> Αλλαγή προκαθορισμένου μεγέθους <basefont size=5> Μορφοποίηση κειμένου με απλή HTML (ΙΙ) <HTML><HEAD><TITLE>Fonts</TITLE> </HEAD> <BODY> <p><b><font size=+5>v</font><font size=+3>olcano WEB</font></b></p> <font size=12>info about volcanos...</font> </BODY></HTML> 5

6 Χρώμα γραμματοσειράς με απλή HTML <HTML><HEAD><TITLE>Font Colors</TITLE> </HEAD> <BODY> <B><font size=+4 color=#ff66ff>v</font> <font size=+3 color=#dd0055>olcano WEB</font></B> <p><font size=12>info about volcanos...</font> </BODY></HTML> Μορφοποίηση κάθε κεφαλίδας και παραγράφου ξεχωριστάμεαπλήhtml Η μορφοποίηση κάθε κεφαλίδας ή παραγράφου ξεχωριστά είναι δύσκολη και χρονοβόρα διαδικασία (η HTML δεν είναι σχεδιασμένη γι αυτό το σκοπό) <html> <head> <title>standard formatting is not easy...</title> </head> <body> <h1>αυτή είναι μια επικεφαλίδα. Ποιο είναι το χρώμα της;</h1> <font color="blue"> <h1>αυτή είναι μια χρωματισμένη επικεφαλίδα...</h1> </font> <font color="blue"> <h1>αυτή </font> </body> </html> η επικεφαλίδα έχει το ίδιο χρώμα...</h1> Παράδειγμα 6

7 Επικαλυπτόμενα φύλλα στυλ (CSS) Επικαλυπτόμενα φύλλα στυλ (Cascading Style Sheets): μια νέα τεχνολογία που τυποποιήθηκε από το W3C για να επιτρέψει στους web authors να ασκήσουν αποτελεσματικό έλεγχο στη σχεδίαση / μορφοποίηση των εγγράφων, πέρα από την περιγραφή του τρόπου εμφάνισής τους Ένας κανόνας CSS αποτελείται από δύο μέρη: Επιλογέα (selector): ένα tag της HTML, π.χ. h1 ή p ήλωση (declaration): ορίζει την ιδιότητα και την τιμή του επιλογέα h1 {color: blue; font-size: 15pt; } Επιλογέας Ιδιότητα Τιμή Που τοποθετούνται οι κανόνες στυλ: Ενσωματωμένο φύλλο στυλ Εξωτερικό φύλλο στυλ Ένθετο στυλ Υποστηρίζονται από ΙΕ4 και Netscape4 και μεταγενέστερους Μορφοποίηση με ενσωματωμένα στυλ (I) <html> <head> <title>styles formatting is easier!...</title> <style type="text/css"> h1 {color: red} h2 {color: yellow} p {color: green; } </style> </head> Ομοιόμορφη μορφοποίηση όλων των κεφαλίδων επιπέδου 1 του HTML εγγράφου με κόκκινο χρώμα font-size: 15pt; font-family: "Times New Roman"; 7

8 Μορφοποίηση με ενσωματωμένα στυλ (ΙI) <body> <h1>επικεφαλίδα επιπέδου 1</h1> <font color="blue"> <h2>επικεφαλίδα επιπέδου 2...</h2> </font> <p>αυτό είναι κείμενο παραγράφου...</p> <font size="12" color="blue"> <p>αυτή είναι μια δεύτερη παράγραφος...</p> </font> </body> </html> Μορφοποίηση με ενσωματωμένα στυλ (IIΙ) Μειονέκτημα χρήσης styles: ακόμα κι αν θέλω να αλλάξω τη μορφοποίηση κάποιας δομής που έχω συμπεριλάβει στο style, αυτό δεν είναι εφικτό! 8

9 Μορφοποίηση με ενσωματωμένα στυλ (IV) <HEAD> <STYLE TYPE="text/css"> body {background-color: #CCFFCC; font-family: Arial, Helvetica, sans-serif; color: #330066} a:link {color: #CC9900} a:visited {color: #660000} a:hover {color: #FFCC00} a:active {color: #FF0000} </STYLE> </HEAD> Σύνδεσμος που δεν έχει επιλεγεί Σύνδεσμος που έχει επιλεγεί Ο δείκτης του ποντικιού βρίσκεται από πάνω του Ενεργός σύνδεσμος (έχει επιλεγεί τελευταία) Παράδειγμα Μορφοποίηση με στυλ που ορίζεται σε εξωτερικό αρχείο <style type="text/css"> body { background-color: #CCFFFF; font-family: Arial, Helvetica, sans-serif; color: #330066} a:link { color: #CC9900} a:visited { color: #660000} a:hover { color: #FFCC00} </style> <html> <head> <link rel="stylesheet" href="mystyle.css"> </head> <body>... </body> </html> mystyle.css Οι κανόνες μορφοποίησης αυτού του εγγράφου έχουν οριστεί στο αρχείο mystyle.css Ποιο το πλεονέκτημα χρήσης εξωτερικών αρχείων στυλ; Το ίδιο CSS αρχείο μπορεί να ορίσει τη μορφοποίηση περισσότερων εγγράφων (σε αντίθεση με τους ενσωματωμένους κανόνες στυλ) 9

10 Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: έλεγχος διάταξης σελίδων (Ι) Ιδιότητα margin-top margin-right margin-bottom margin-left margin Περιγραφή Πάνω περιθώριο ενός στοιχείου εξί περιθώριο ενός στοιχείου Κάτω περιθώριο ενός στοιχείου Αριστερό περιθώριο ενός στοιχείου Ορίζει όλα τα περιθώρια ενός στοιχείου (ισοδυναμεί με τη χρήση των 4 παραπάνω ιδιοτήτων) Τιμές Μέγεθος, ποσοστό ή auto Μέγεθος, ποσοστό ή auto Μέγεθος, ποσοστό ή auto Μέγεθος, ποσοστό ή auto έχεται μία ως 4 τιμές Τιμές: μονάδες μέτρησης όπως px (pixels), in (ίντσες), mm (χιλιοστά), cm (εκατοστά), και άλλες Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: έλεγχος διάταξης σελίδων (ΙΙ) Ιδιότητα padding-top padding-right padding-bottom padding-left padding Περιγραφή Κενό μεταξύ του πάνω περιθωρίου και του περιεχομένου ενός στοιχείου Κενό μεταξύ του δεξιού περιθωρίου και του περιεχομένου ενός στοιχείου Κενό μεταξύ του κάτω περιθωρίου και του περιεχομένου ενός στοιχείου Κενό μεταξύ του αριστερού περιθωρίου και του περιεχομένου ενός στοιχείου Ορίζει όλα τα κενά από όλα τα περιθώρια ενός στοιχείου (ισοδυναμεί με τη χρήση των 4 παραπάνω ιδιοτήτων) Τιμές Μέγεθος, ποσοστό ή auto Μέγεθος, ποσοστό ή auto Μέγεθος, ποσοστό ή auto Μέγεθος, ποσοστό ή auto έχεται μία ως 4 τιμές 10

11 Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: έλεγχος διάταξης σελίδων (ΙΙΙ) <STYLE TYPE="text/css"> <!-- body { background-color: #CCFFCC; font-family: Arial, Helvetica, sans-serif; color: #330066; margin: 50px, 70px;} a:link { color: #CC9900} a:visited { color: #660000} a:hover { color: #FFCC00} a:active { color: #FF0000} h1 { padding: 10px, 10px } h2 { padding-top: 5px; padding-bottom: 3px } --> </STYLE> Παράδειγμα Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: φόντο (υπόβαθρο) εγγράφων (I) Ιδιότητα color background -color background -image background Περιγραφή Χρώμα προσκηνίου για ένα στοιχείο (ισχύει κυρίως για το κείμενο ενός στοιχείου) Χρώμα φόντου (παρασκηνίου) για ένα στοιχείο Καθορίζει αν η εικόνα φόντου επαναλαμβάνεται σε πλευρική παράθεση και, αν ναι, πως Ισοδυναμεί με χρήση όλων των προηγούμενων ιδιοτήτων χρώμα Τιμές χρώμα ή transparent repeat (επανάληψη οριζόντια/κάθετα), repeatx (επανάληψη κάθετα), repeat-y (επανάληψη κάθετα), no-repeat 11

12 Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: φόντο (υπόβαθρο) εγγράφων (ΙI) <STYLE TYPE="text/css"> <!-- body { background-color: #CCFFCC; color: #330066; margin: 50px, 70px ; background-image: url(background.gif); background-repeat: repeat } h1 { color: #996633; padding-top: 10px; padding-bottom: 5px ; background-color: #FFFFCC } h2 { color: #996633; padding-top: 5px; padding-bottom: 3px; background-color: #CCFFCC} --> </STYLE> Παράδειγμα Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: περιγράμματα (borders) (I) Ιδιότητα bordercolor borderstyle borderwidth border Περιγραφή Ορίζει το στυλ για τα 4 περιγράμματα ενός στοιχείου Το χρώμα για τα 4 περιγράμματα ενός στοιχείου Το πάχος για τα 4 περιγράμματα ενός στοιχείου Ισοδυναμεί με χρήση όλων των προηγούμενων ιδιοτήτων (ορίζει το πάχος, χρώμα και στυλ των 4 περιγραμμάτων) Τιμές none, dotted, dashed, solid, double,. χρώμα ή transparent thin, medium, thick έχεται μία ως 3 τιμές 12

13 Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: περιγράμματα (borders) (ΙI) <STYLE TYPE="text/css"> <!-- h1 { color: #996633; padding-top: 10px; padding-bottom: 5px ; background-color: #FFFFCC ; border-color: "green"; border-style: double; border-width: thin } h2 { color: #996633; padding-top: 5px; padding-bottom: 3px; background-color: #CCFFCC; border-color:"yellow"; border-style: dashed; border-width: thin; } --> </STYLE> Παράδειγμα Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: στυλ γραμματοσειράς Ιδιότητα font-family font-size font-style font-weight font-variant font Περιγραφή H οικογένεια χαρακτήρων Μέγεθος γραμματοσειράς Στυλ γραμματοσειράς Πάχος γραμματοσειράς Γραμματοσειρά με μικρά κεφαλαία ή κανονικά Ισοδυναμεί με χρήση όλων των προηγούμενων ιδιοτήτων Τιμές Arial, Times, serif, sansserif, fantasy,. Απόλυτο, σχετικό ή ποσοστιαίο μέγεθος oblique (με κλίση), italic (πλάγια), normal (κανονικό) bold (έντονο), bolder (εντονότερο), lighter (λεπτό), normal (κανονικό) small-caps (μικρά κεφαλαία), normal (κανονικό) 13

14 Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: στοίχιση κειμένου Ιδιότητα verticalalign lineheight text-align textdecoration letterspacing textindent Περιγραφή Απόσταση μεταξύ γραμμών (διάστιχο) Κατακόρυφη στοίχιση ενός στοιχείου ή σε σχέση με το πατρικό του ή σε σχέση με το ύψος της γραμμής του Στοίχιση κειμένου «ιακόσμηση» γραμματοσειράς Εσοχή της πρώτης γραμμής ιάστημα μεταξύ χαρακτήρων Τιμές π.χ. =2 (διπλάσιο από το μέγεθος γραμματοσειράς) ή =15px (15 pixels) baseline, middle, sub, super, text-top, textbottom ή top, bottom left, center, right, justify underline, overline, linethrough, blink Απόλυτο μέγεθος ή ποσοστό επί το πλάτος του στοιχείου Απόλυτο μέγεθος ή normal Συνηθισμένες ιδιότητες/τιμές για φύλλα στυλ: στυλ γραμματοσειράς & στοίχιση κειμένου <STYLE TYPE="text/css"> <!-- body {font-family: Arial, Helvetica, sans-serif; background-image: url(background.gif); background-repeat: repeat } h1 { color: #996633; padding-top: 10px; padding-bottom: 5px ; background-color: #FFFFCC ; border-color: #CCCC33; border-width: thin; font-family: "fantasy"; border: thin outset; text-align: center} h2 { color: #996633; padding-top: 5px; padding-bottom: 3px; background-color: #CCFFCC; border-color: #99CC33; border-width: thin; font-family: "fantasy"; border: thin inset; text-align: center} --> </STYLE> Παράδειγμα 14

15 Μορφοποίηση με ένθετα στυλ (inline styles) Ένθετα στυλ: Ο τρίτος τρόπος εφαρμογής κανόνων στυλ Επιτρέπουν την εφαρμογή στυλ σε ένα μόνο στοιχείο ενός εγγράφου και όχι σε ολόκληρο το έγγραφο, π.χ. διαφορετικό χρώμα σε μια επικεφαλίδα σε σχέση με όλες τις υπόλοιπες επικεφαλίδες <p style= color: red; font-weight: bold This paragraph will be bold and red.</p> Τι σημαίνει όρος «επικαλυπτόμενα» ( cascading ) (Ι); Ο όρος επικαλυπτόμενα σημαίνει ότι μπορούμε να συνδυάσουμε πληροφορίες για τα στυλ ενός εγγράφου από περισσότερες από μία πηγές Τα εξωτερικά φύλλα στυλ μπορούν να «διασυνδέονται» με πολλές σελίδες, εφαρμόζοντας σε όλες τους ίδιους κανόνες στυλ Τα ενσωματωμένα φύλλα στυλ εφαρμόζουν κανόνες σε μια μεμονωμένη ιστοσελίδα Τα ένθετα (inline) στυλ εφαρμόζουν κανόνες σε συγκεκριμένα σημεία μιας ιστοσελίδας Σε ένα έγγραφο μπορούμε να συνδυάσουμε και τις τρεις παραπάνω μεθόδους για την εφαρμογή κανόνων στυλ 15

16 Τι σημαίνει όρος «επικαλυπτόμενα» ( cascading ) (ΙΙ); Η έννοια της επικάλυψης έγκειται στο γεγονός ότι μια αυστηρή ιεραρχία στην εφαρμογή κανόνων στυλ, όταν χρησιμοποιούνται και οι τρεις δυνατοί τρόποι εφαρμογής τους, δηλαδή κάποιοι κανόνες έχουν προτεραιότητα έναντι άλλων: Τα στυλ που ορίζονται σε εξωτερικό στυλ εφαρμόζονται πρώτα στη σελίδα Τα στυλ που ορίζει το ενσωματωμένο φύλλο στυλ εφαρμόζονται μετά και υπερισχύουν έναντι των στυλ που εφαρμόστηκαν προηγουμένως Τα ένθετα στυλ υπερισχύουν έναντι των εξωτερικών και ενσωματωμένων στυλ και εφαρμόζονται τελευταία Παράδειγμα επικάλυψης κανόνων στυλ (Ι) <style type="text/css"> <!-- body {font-family: Arial, Helvetica, sans-serif; color: green} p {color: blue; line-height: 2; text-indent: 30px; text-align: center} --> </style> mystyle.css 16

17 Παράδειγμα επικάλυψης κανόνων στυλ (ΙΙ) <HTML> <HEAD> <TITLE>The Bookworm Bookshop</TITLE> <LINK REL="stylesheet" HREF="mystyle.css"> <style type="text/css"> h1 {text-decoration: underline} p {text-align: right} </style></head> Εξωτερικό αρχείο στυλ (mystyle.css) για τη μορφοποίηση του εγγράφου Ενσωματωμένο στυλ για μορφοποίηση επικεφαλίδων και παραγράφων Χρήση ένθετων στυλ για τη μορφοποίηση της πρώτης επικεφαλίδας και παραγράφου <BODY> <h1 style="text-decoration: line-through">πρώτη επικεφαλίδα</h1> <p style="text-align: left; font-weight: bold">πρώτη παράγραφος. Πρώτη παράγραφος. Πρώτη παράγραφος. Πρώτη παράγραφος. Πρώτη...</p> <h1> εύτερη επικεφαλίδα</h1> <p> < εύτερη παράγραφος. εύτερη παράγραφος. εύτερη παράγραφος. εύτερη παράγραφος. εύτερη παράγραφος. εύτερη... </p> </BODY></HTML> Παράδειγμα επικάλυψης κανόνων στυλ (ΙΙΙ) Παράδειγμα 17

Γαβαλάς Δαμιανός dgavalas@aegean.gr

Γαβαλάς Δαμιανός dgavalas@aegean.gr Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας Δικτυακά Πολυμέσα IΙ (Β Έτος, 4ο εξ) Εργαστήριο #3ο: Ορισμός επιλογέων, μορφοποίηση με CSS Γαβαλάς Δαμιανός

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

Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS)

Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS) Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS) Γαβαλάς Δαμιανός dgavalas@aegean.gr Επικαλυπτόμενα Φύλλα Στυλ (Cascading Style Sheets, CSS) Η (X)HTML προσδιορίζει τη βασική

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

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

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

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

ΗTML και XHTML Βασικές. Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας

ΗTML και XHTML Βασικές. Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας ΗTML και XHTML Βασικές έννοιες Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας Η γραμματική της ΗΤML Όπως κάθε γλώσσα έχει μια γραμματική

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

ΕΠΛ 012. Φύλλα Στυλ (ΙΙ)

ΕΠΛ 012. Φύλλα Στυλ (ΙΙ) ΕΠΛ 012 Φύλλα Στυλ (ΙΙ) Τροποποίηση χρωµάτων Color: "όνοµα χρώµατος" rgb (rr,gg,bb) #RRGGBB RGB συνιστώσες όπου rr,gg,bb είναι ακέραιοι από το 0 255 H1 {color: rgb(255,0,0)} κόκκινες επικεφαλίδες background-colorcolor

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

3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ

3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ 2014 3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ Εισαγωγή Το CSS (Cascading Style Sheets) είναι αρχεία με κατάληξη.css τα οποία καθορίζουν την μορφοποίηση των ιστοσελίδων. Μέσω αυτών επιτυγχάνεται

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

Οδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!).

Οδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!). Εργαστήριο #8 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε

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

Διάλεξη 4η CSS intermediate

Διάλεξη 4η CSS intermediate Διάλεξη 4η CSS intermediate Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e. c o. d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Κλάσεις & Ids Εμφώλευση &

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

Εργαστήριο #9 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. βεβαιωθείτε ότι έχετε ολοκληρώσει τις προηγούμενες ασκήσεις Οδηγίες

Εργαστήριο #9 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. βεβαιωθείτε ότι έχετε ολοκληρώσει τις προηγούμενες ασκήσεις Οδηγίες Εργαστήριο #9 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε

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

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

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

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

HTML... 1. Εισαγωγή στην HTML και τα CSS

HTML... 1. Εισαγωγή στην HTML και τα CSS HTML...... 1 Εισαγωγή στην HTML και τα CSS HTML...... 2 HTML. H HTML (HYPERTEXT MARKUP LANGUAGE), είναι µία γλώσσα η οποία «λέει» στον υπολογιστή πως θα πρέπει να εµφανίσει µία ιστοσελίδα. Τα αρχεία στα

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

Εισαγωγή στο CSS Από: Λία Βέρου

Εισαγωγή στο CSS Από: Λία Βέρου Εισαγωγή στο CSS Από: Λία Βέρου Τι είναι το CSS (Cascading Style Sheets); To CSS είναι μια απλή γλώσσα που μας βοηθάει να ορίσουμε με σαφήνεια και ιδιαίτερη ευελιξία τον τρόπο με τον οποίο θα εμφανίζονται

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

Εισαγωγή στο CSS Από: Μιχαήλια Κομβούτη Βέρου

Εισαγωγή στο CSS Από: Μιχαήλια Κομβούτη Βέρου Εισαγωγή στο CSS Από: Μιχαήλια Κομβούτη Βέρου Τι είναι το CSS (Cascading Style Sheets); To CSS είναι μια απλή γλώσσα που μας βοηθάει να ορίσουμε με σαφήνεια και ιδιαίτερη ευελιξία τον τρόπο με τον οποίο

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

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

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

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

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

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

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

Εμφάνιση και κρύψιμο στοιχείων

Εμφάνιση και κρύψιμο στοιχείων Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #8 0 : Δυναμικά εφέ με χρήση CSS Γαβαλάς Δαμιανός dgavalas@aegean.gr Εμφάνιση και κρύψιμο στοιχείων Χρήση της ιδιότητας display με επιτρεπτές τιμές: none: κρύψιμο του στοιχείου

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

Σπουδές 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

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

Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας

Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας Δικτυακά Πολυμέσα Ι (Β Έτος, 3ο εξ) Διάλεξη #5η: HTML: πίνακες (tables), πλαίσια (frames) Γαβαλάς Δαμιανός

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

ΠΛΗΡΟΦΟΡΙΑΚΑ & ΤΗΛΕΠΙΚΟΙΝΩΝΙΑΚΑ ΣΥΣΤΗΜΑΤΑ

ΠΛΗΡΟΦΟΡΙΑΚΑ & ΤΗΛΕΠΙΚΟΙΝΩΝΙΑΚΑ ΣΥΣΤΗΜΑΤΑ Οικονοµικό Πανεπιστήµιο Αθηνών Τµήµα ιοικητικής Επιστήµης & Τεχνολογίας ΠΛΗΡΟΦΟΡΙΑΚΑ & ΤΗΛΕΠΙΚΟΙΝΩΝΙΑΚΑ ΣΥΣΤΗΜΑΤΑ Κεφάλαιο 11 Eισαγωγή στην ανάπτυξη ιστοσελίδων µε HMTL Γιώργος Γιαγλής Περίληψη Κεφαλαίου

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

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

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

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

ΠΤΥΧΙΑΚΗ ΕΡΓΑΣΙΑ. Σχεδιασμός και υλοποίηση βάσης δεδομένων οδηγών επαγγελμάτων / ειδικοτήτων ΤΕΙ. Αρ. Μητρώου: 04/2557

ΠΤΥΧΙΑΚΗ ΕΡΓΑΣΙΑ. Σχεδιασμός και υλοποίηση βάσης δεδομένων οδηγών επαγγελμάτων / ειδικοτήτων ΤΕΙ. Αρ. Μητρώου: 04/2557 ΠΤΥΧΙΑΚΗ ΕΡΓΑΣΙΑ Σχεδιασμός και υλοποίηση βάσης δεδομένων οδηγών επαγγελμάτων / ειδικοτήτων ΤΕΙ Της φοιτήτριας Τσαντοπούλου Βαΐα- Αικατερίνη Επιβλέπων καθηγητής Βασίλης Κώστογλου Αρ. Μητρώου: 04/2557 Θεσσαλονίκη

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

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

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

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

Κειµενογράφοι ετικετών

Κειµενογράφοι ετικετών ΕΠΛ 012 Γλώσσα Μορφοποίησης HTML Πως κτίζουµε τις Ετικέτες Notepad ή άλλο TEXT editor Πού τα κάνουµε Save? Πώς τα οργανώνουµε Πώς τα βάζουµε δηµόσια online Τα αρχεία να τελειώνουν σε.html ή.htm Πως ξεκινούµε

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

CSS. Προγρ/σμός Εφαρμογών Διαδικτύου. (version: 13/03/2016) Φ. Κόκκορας / Καθ. Εφαρμογών. Τμήμα Μηχανικών Πληροφορικής ΤΕ.

CSS. Προγρ/σμός Εφαρμογών Διαδικτύου. (version: 13/03/2016) Φ. Κόκκορας / Καθ. Εφαρμογών. Τμήμα Μηχανικών Πληροφορικής ΤΕ. CSS Cascading Style Sheets Προγρ/σμός Εφαρμογών Διαδικτύου (version: 13/03/2016) Φ. Κόκκορας / Καθ. Εφαρμογών Τμήμα Μηχανικών Πληροφορικής ΤΕ ΤΕΙ Θεσσαλίας Τι Είναι τα CSS; 2 Cascading (στοιβαγμένα) Style

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

12. HTML και CSS. Προαπαιτούμενες Γνώσεις: Απλή γνώση της σύνταξης HTML. Αρκεί η άσκηση «Η γλώσσα HTML Εισαγωγή».

12. HTML και CSS. Προαπαιτούμενες Γνώσεις: Απλή γνώση της σύνταξης HTML. Αρκεί η άσκηση «Η γλώσσα HTML Εισαγωγή». 12. HTML και CSS Σκοπός του Εργαστηρίου: Σκοπός της παρούσας εργαστηριακής άσκησης είναι η εισαγωγή στην τεχνολογία Cascading Style Sheets (CSS), η εξοικείωση με τις βασικές αρχές και χρήσεις της και τη

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

CSS 2. Γηδάζθνληεο: Π. Αγγειάηνο, Γ. Εήλδξνο Δπηκέιεηα δηαθαλεηώλ: Π. Αγγειάηνο. Σρνιή Ζιεθηξνιόγσλ Μεραληθώλ θαη Μεραληθώλ Υπνινγηζηώλ

CSS 2. Γηδάζθνληεο: Π. Αγγειάηνο, Γ. Εήλδξνο Δπηκέιεηα δηαθαλεηώλ: Π. Αγγειάηνο. Σρνιή Ζιεθηξνιόγσλ Μεραληθώλ θαη Μεραληθώλ Υπνινγηζηώλ CSS 2 Γηδάζθνληεο: Π. Αγγειάηνο, Γ. Εήλδξνο Δπηκέιεηα δηαθαλεηώλ: Π. Αγγειάηνο Σρνιή Ζιεθηξνιόγσλ Μεραληθώλ θαη Μεραληθώλ Υπνινγηζηώλ Σηόρνο ηεο ώξαο Δπέθηαζε ησλ γλώζεσλ ηνπ CSS 1 Κιάζεηο θαη id Δκθώιεπζε

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

Telecommunications με τη χρήση του. "Κατασκευή ιστοσελίδας. προγράμματος Adobe Dreamweaver" Τ.Ε.Ι. ΠΕΙΡΑΙΑ ΤΙΤ ΛΟΣ ΠΤΥΧΙΑΚΗΣ ..._

Telecommunications με τη χρήση του. Κατασκευή ιστοσελίδας. προγράμματος Adobe Dreamweaver Τ.Ε.Ι. ΠΕΙΡΑΙΑ ΤΙΤ ΛΟΣ ΠΤΥΧΙΑΚΗΣ ..._ .. Τ.Ε.Ι. ΠΕΙΡΑΙΑ ΤΜΗΜΑ ΗΛΕΚΤΡΟΝΙΚΩΝ ΥΠΟΛΟΓΙΣΤΙΚΩΝ ΣΥΣΤΗΜΑΤΩΝ...._ ΤΙΤ ΛΟΣ ΠΤΥΧΙΑΚΗΣ "Κατασκευή ιστοσελίδας Telecommunications με τη χρήση του προγράμματος Adobe Dreamweaver" ΣΠΟΥΔΑΣΤΗΣ: ΤΣΙΓΚΡΙΜΑΝΗΣ ΒΑΣΙΛΕΙΟΣ

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

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

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

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

ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ

ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ Κεφάλαιο 4. Η γλώσσα HTML Επιμέλεια: Καραγιάννης Σπύρος Καθηγητής ΠΕ19 Βασικοί κανόνες σύνταξης HTML ομή σελίδας HTML Μορφοποίηση κειμένου Κατάλογοι Εισαγωγή

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

ΜΑΘΗΜΑ Στοίχιση Παραγράφων. 2. Εσοχές Παραγράφων ΣΤΟΧΟΙ:

ΜΑΘΗΜΑ Στοίχιση Παραγράφων. 2. Εσοχές Παραγράφων ΣΤΟΧΟΙ: ΜΑΘΗΜΑ 4 ΣΤΟΧΟΙ: 1. Στοίχιση Παραγράφων 2. Εσοχές Παραγράφων 3. Διάστημα Μεταξύ Γραμμών (Διάστιχο) 4. Απόσταση Μεταξύ Παραγράφων 5. Καθορισμός Στηλοθετών (Tabs) 6. Μετακίνηση Στηλοθετών 7. Διαγραφή Στηλοθετών

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

Γραπτή εξέταση. Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Διάλεξη #12 η : Επανάληψη, προετοιμασία για τις γραπτές εξετάσεις

Γραπτή εξέταση. Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Διάλεξη #12 η : Επανάληψη, προετοιμασία για τις γραπτές εξετάσεις Δικτυακά Πολυμέσα ΙΙ Διάλεξη #12 η : Επανάληψη, προετοιμασία για τις γραπτές εξετάσεις Γαβαλάς Δαμιανός dgavalas@aegean.gr Γραπτή εξέταση H διάρκεια της εξέτασης θα είναι 2 ώρες και 15 Θα απαντήσετε σε

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

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

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

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

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

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

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

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

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

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

Βασίλειος Κοντογιάννης ΠΕ19

Βασίλειος Κοντογιάννης ΠΕ19 Ενότητα3 Επικοινωνία και Διαδίκτυο 11.1 Γενική Εισαγωγή στην HTML Τι είναι η HTML (HyperText Markup Language); Είναι μια γλώσσα σήμανσης (Markup) με την οποία πραγματοποιείται η δόμηση σελίδων του Παγκόσμιου

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

Πρόλογος... 7 ΕΙΔΙΚΟΣ ΕΦΑΡΜΟΓΩΝ ΠΛΗΡΟΦΟΡΙΚΗΣ

Πρόλογος... 7 ΕΙΔΙΚΟΣ ΕΦΑΡΜΟΓΩΝ ΠΛΗΡΟΦΟΡΙΚΗΣ ΠΕΡΙΕΧΟΜΕΝΑ Πρόλογος... 7 ΕΙΔΙΚΟΣ ΕΦΑΡΜΟΓΩΝ ΠΛΗΡΟΦΟΡΙΚΗΣ ΘΕΜΑΤΙΚΗ ΕΝΟΤΗΤΑ Α Δομή και λειτουργία προσωπικού υπολογιστή...11 ΘΕΜΑΤΙΚΗ ΕΝΟΤΗΤΑ Β Δομή και χρήση λειτουργικών συστημάτων DOS, UNIX και λειτουργικού

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

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

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

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

Εξεταστέα Ύλη (Syllabus) Έκδοση 1.5

Εξεταστέα Ύλη (Syllabus) Έκδοση 1.5 Εξεταστέα Ύλη (Syllabus) Έκδοση 1.5 Πνευματικά Δικαιώματα 2005 Ίδρυμα ECDL (ECDL Foundation www.ecdl.com) Όλα τα δικαιώματα είναι κατοχυρωμένα. Κανένα μέρος αυτού του εγγράφου δεν μπορεί να αναπαραχθεί

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

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

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

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

ΠΡΟΓΡΑΜΜΑΤΙΣΜΟΣ ΙΑ ΙΚΤΥΟΥ

ΠΡΟΓΡΑΜΜΑΤΙΣΜΟΣ ΙΑ ΙΚΤΥΟΥ ΠΡΟΓΡΑΜΜΑΤΙΣΜΟΣ ΙΑ ΙΚΤΥΟΥ HTLM CSS Lecture 2 ver. 2.03 Jan 2011 ρ. Γεώργιος Φ. Φραγκούλης 1 The HTML head Element The head element is a container for all the head elements. Elements inside can include

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

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

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

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

ΑΛΛΗΛΕΠΙΔΡΑΣΗ ΑΝΘΡΩΠΟΥ - ΥΠΟΛΟΓΙΣΤΗ

ΑΛΛΗΛΕΠΙΔΡΑΣΗ ΑΝΘΡΩΠΟΥ - ΥΠΟΛΟΓΙΣΤΗ ΠΑΝΕΠΙΣΤΗΜΙΟ ΚΡΗΤΗΣ ΣΧΟΛΗ ΘΕΤΙΚΩΝ ΕΠΙΣΤΗΜΩΝ ΤΜΗΜΑ ΕΠΙΣΤΗΜΗΣ ΥΠΟΛΟΓΙΣΤΩΝ ΜΑΘΗΜΑ ΕΠΙΛΟΓΗΣ ΗΥ-464 ΑΛΛΗΛΕΠΙΔΡΑΣΗ ΑΝΘΡΩΠΟΥ - ΥΠΟΛΟΓΙΣΤΗ Διδάσκων: Κωνσταντίνος Στεφανίδης Εισαγωγή HTML Στοιχεία HTML Παράμετροι

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

Διάλεξη 3η HTML intermediate

Διάλεξη 3η HTML intermediate Διάλεξη 3η HTML intermediate Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e. c o. d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Επέκταση γνώσεων στην html

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

1. Απαιτήσεις εργασίας

1. Απαιτήσεις εργασίας ctxxxxx.html 1 η ΕΡΓΑΣΙΑ: ΑΝΑΠΤΥΞΗ ΔΙΑΔΙΚΤΥΑΚΟΥ ΤΟΠΟΥ (WEB SITE) Ημερομηνία Παράδοσης: Τρίτη 1 Δεκέμβρη 2009 (Η εργασία είναι ατομική!!) 1. Απαιτήσεις εργασίας Θα πρέπει να δημιουργήσετε το web site μιας

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

2. Επιλέξτε την σωστή ετικέτα HTML που προσφέρει το μεγαλύτερο φόντο κειμένου. <head> <heading> <h6> <h1>

2. Επιλέξτε την σωστή ετικέτα HTML που προσφέρει το μεγαλύτερο φόντο κειμένου. <head> <heading> <h6> <h1> ΤΜΗΜΑ ΗΛΕΚΤΡΟΝΙΚΗΣ Τομέας Υπολογιστικών Συστημάτων και Ελέγχου Τεχνολογίες Πολυμέσων - Εφαρμογές Δρ. Β. ΒΑΛΑΜΟΝΤΕΣ Ε-mail: vala@teiath.gr Να απαντήσετε στις παρακάτω ερωτήσεις. 1. Τι σημαίνουν τα αρχικά

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

Cascading Style Sheets Φόρμες (Forms)

Cascading Style Sheets Φόρμες (Forms) Cascading Style Sheets Φόρμες (Forms) Πανεπιστήμιο Πελοποννήσου Τμήμα Επιστήμης & Τεχνολογίας Τηλεπικοινωνιών Ευάγγελος Α. Κοσμάτος Cascading Style Sheets Τα Cascading Style Sheets (CSS) είναι οδηγίες

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

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

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

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

ΔΕ10: Πληροφοριακά Συστήματα Διοίκησης IΙ Εργαστήριο # 2

ΔΕ10: Πληροφοριακά Συστήματα Διοίκησης IΙ Εργαστήριο # 2 ΔΕ10: Πληροφοριακά Συστήματα Διοίκησης IΙ Εργαστήριο # 2 Dreamweaver 1/7 Εισαγωγή Το Dreamweaver είναι ένας HTML editor που αναπτύχθηκε από την Macromedia. Είναι WYSIWYG (What You See Is What You Get),

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

ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ ΕΛΛΗΝΙΚΟ ΑΝΟΙΚΤΟ ΠΑΝΕΠΙΣΤΗΜΙΟ. Οι Διπλωματικές Εργασίες, θα πρέπει να παραδίδονται ακολουθώντας τις παρακάτω προδιαγραφές.

ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ ΕΛΛΗΝΙΚΟ ΑΝΟΙΚΤΟ ΠΑΝΕΠΙΣΤΗΜΙΟ. Οι Διπλωματικές Εργασίες, θα πρέπει να παραδίδονται ακολουθώντας τις παρακάτω προδιαγραφές. ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ ΕΛΛΗΝΙΚΟ ΑΝΟΙΚΤΟ ΠΑΝΕΠΙΣΤΗΜΙΟ Εργαστήριο Εκπαιδευτικού Υλικού & Εξ @ποστάσεως Βιβλιοθήκη Εκπαιδευτικής Μεθοδολογίας (Ε.Ε.Υ.Ε.Μ.) και Κέντρο Πληροφόρησης Πατρών Κλάους 278 Πατρών - Κλάους

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

Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία

Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία Blog στο Wordpress Επιμέλεια: Δέγγλερη Σοφία Περιεχόμενα Μετάβαση στο blog Σύνδεση ως διαχειριστής Πίνακας ελέγχου Εμφάνιση Ρυθμίσεις Άρθρα Σελίδες Πολυμέσα Σύνδεσμοι Widgets Μετάβαση στο blog Πληκτρολογούμε

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

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

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

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

Σχεδιαζόμενη Απόδειξη Πληρωμής

Σχεδιαζόμενη Απόδειξη Πληρωμής Σχεδιαζόμενη Απόδειξη Πληρωμής Το συγκεκριμένο εγχειρίδιο δημιουργήθηκε για να βοηθήσει την κατανόηση της Διαδικασίας Σχεδιαζόμενης Απόδειξης Πληρωμής. Παρακάτω προτείνεται μια αλληλουχία ενεργειών την

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

Εργαλεία ανάπτυξης εφαρμογών internet Ι

Εργαλεία ανάπτυξης εφαρμογών internet Ι IEK ΟΑΕΔ ΚΑΛΑΜΑΤΑΣ ΤΕΧΝΙΚΟΣ ΕΦΑΡΜΟΓΩΝ ΠΛΗΟΦΟΡΙΚΗΣ Εργαλεία ανάπτυξης εφαρμογών internet Ι HTML Διδάσκουσα: Κανελλοπούλου Χριστίνα ΠΕ19 Πληροφορικής HTML (HyperText Markup Language) Η γλώσσα που χρησιμοποιείται

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

Θέματα Ψηφιακής Οικονομίας

Θέματα Ψηφιακής Οικονομίας Θέματα Ψηφιακής Οικονομίας Ενότητα 3: Δημιουργία mockup δικτυακής επιχείρισης Μανώλης Τζαγκαράκης, Βικτωρία Δασκάλου Σχολή Οργάνωσης και Διοίκησης Επιχειρήσεων Τμήμα Οικονομικών Επιστημών Σκοποί ενότητας

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

Θέματα 2,3 ης εβδομάδας. Αρχιγράμματα Σύμβολα Κεφαλίδες & Υποσέλιδα Λίστες Περιγράμματα & Σκίαση Ορθογραφικός έλεγχος

Θέματα 2,3 ης εβδομάδας. Αρχιγράμματα Σύμβολα Κεφαλίδες & Υποσέλιδα Λίστες Περιγράμματα & Σκίαση Ορθογραφικός έλεγχος ΠΛΗΡΟΦΟΡΙΚΗ Ι Θέματα 2,3 ης εβδομάδας Αρχιγράμματα Σύμβολα Κεφαλίδες & Υποσέλιδα Λίστες Περιγράμματα & Σκίαση Ορθογραφικός έλεγχος Αρχιγράμματα (1/2) Μπορούμε να βάλουμε αρχιγράμματα στην αρχή παραγράφων

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

Πνευματικά Δικαιώματα 2013 Ίδρυμα ECDL (ECDL Foundation - www.ecdl.org)

Πνευματικά Δικαιώματα 2013 Ίδρυμα ECDL (ECDL Foundation - www.ecdl.org) PEOPLECERT Hellas A.E - Φορέας Πιστοποίησης Ανθρώπινου Δυναμικού Κοραή 3, 105 64 Αθήνα, Τηλ.: 210 372 9100, Fax: 210 372 9101, e-mail: info@peoplecert.org, www.peoplecert.org Πνευματικά Δικαιώματα 2013

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

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

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

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

ΓΡΑΦΙΚΕΣ ΠΑΡΑΣΤΑΣΕΙΣ ΜΕ ΕXCEL

ΓΡΑΦΙΚΕΣ ΠΑΡΑΣΤΑΣΕΙΣ ΜΕ ΕXCEL ΓΡΑΦΙΚΕΣ ΠΑΡΑΣΤΑΣΕΙΣ ΜΕ ΕXCEL 1. Εισαγωγή δεδομένων σε φύλλο εργασίας του Microsoft Excel Για να τοποθετήσουμε τις μετρήσεις μας σε ένα φύλλο Excel, κάνουμε κλικ στο κελί στο οποίο θέλουμε να τοποθετήσουμε

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

ΔΗΜΙΟΥΡΓΙΑ ΣΧΗΜΑΤΩΝ. 1) Προβολή Γραμμές εργαλείων Σχεδίαση. ΜΑΘΗΜΑ 5 ο : ΣΧΗΜΑΤΑ-ΕΙΚΟΝΕΣ-ΕΞΙΣΩΣΕΙΣ 1

ΔΗΜΙΟΥΡΓΙΑ ΣΧΗΜΑΤΩΝ. 1) Προβολή Γραμμές εργαλείων Σχεδίαση. ΜΑΘΗΜΑ 5 ο : ΣΧΗΜΑΤΑ-ΕΙΚΟΝΕΣ-ΕΞΙΣΩΣΕΙΣ 1 ΣΧΗΜΑΤΑ-ΕΙΚΟΝΕΣ-ΕΞΙΣΩΣΕΙΣ ΔΗΜΙΟΥΡΓΙΑ ΣΧΗΜΑΤΩΝ Για τη δημιουργία σχημάτων στο WORD χρησιμοποιείται η γραμμή εργαλείων της σχεδίασης. Τα βήματα που μπορεί να ακολουθήσετε για να εμφανίσετε τη γραμμή εργαλείων

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

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

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

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

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

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

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

ηµιουργία ιστοσελίδων µε το 1 Microsoft FrontPage

ηµιουργία ιστοσελίδων µε το 1 Microsoft FrontPage ηµιουργία ιστοσελίδων µε το 1 Microsoft FrontPage Τι είναι µια ιστοσελίδα (Web page); Μια ιστοσελίδα (web page) είναι ένα αρχείο που εµφανίζεται στην οθόνη του υπολογιστή από ένα πρόγραµµα που λέγεται

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

Το βασικά χαρακτηριστικά που διαθέτει out-of-the-box (δηλαδή από την αρχική του έκδοση) είναι τα παρακάτω:

Το βασικά χαρακτηριστικά που διαθέτει out-of-the-box (δηλαδή από την αρχική του έκδοση) είναι τα παρακάτω: melissa.cms - το απόλυτο εργαλείο για δηµιουργήσετε την ιστοσελίδα σας To meliisa.cms είναι ένα σύστηµα ανοιχτής αρχιτεκτονικής διαχείρισης περιεχοµένου ιστοσελίδων. Σας επιτρέπει να το χρησιµοποιείται

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

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

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

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

www.costaschatzinikolas.gr

www.costaschatzinikolas.gr ECDL CORE ΕΝΟΤΗΤΑ 3 Επεξεργασία Κειμένου Microsoft Word Επαναληπτικές Ερωτήσεις Εξετάσεων ECDL CORE ΕΝΟΤΗΤΑ 3 Επεξεργασία Κειμένου Microsoft Word Επαναληπτικές Ερωτήσεις Εξετάσεων Δημιουργία - Συγγραφή

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

Εισαγωγή στο Word 2007 Ν. Παπαδόπουλος

Εισαγωγή στο Word 2007 Ν. Παπαδόπουλος Εισαγωγή στο Word 2007 Ν. Παπαδόπουλος Πληκτρολογώ το διπλανό κείµενο. Επειδή το κείµενο αποτελείται από δύο παραγράφους πατάω το Enter µόνο στο τέλος της κάθε παραγράφου και όχι σε κάθε γραµµή 1. δηµιουργία

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

Περιεχόμενα. Εισαγωγή στο Word 2003...9. Βασικές μορφοποιήσεις κειμένων... 41. Κεφάλαιο 1. Κεφάλαιο 2

Περιεχόμενα. Εισαγωγή στο Word 2003...9. Βασικές μορφοποιήσεις κειμένων... 41. Κεφάλαιο 1. Κεφάλαιο 2 Περιεχόμενα Κεφάλαιο 1 Εισαγωγή στο Word 2003...9 Η οθόνη του Word... 9 Δημιουργία νέου εγγράφου... 14 Προσθήκη και διαγραφή κειμένου... 17 Πρώτα επιλογή, μετά εργασία... 18 Εύρεση και αντικατάσταση κειμένου...

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

Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία

Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία Blog στο Wordpress Επιμέλεια: Δέγγλερη Σοφία Περιεχόμενα Μετάβαση στο blog Σύνδεση ως διαχειριστής Πίνακας ελέγχου Εμφάνιση Ρυθμίσεις Άρθρα Σελίδες Πολυμέσα Σύνδεσμοι Μετάβαση στο blog Πληκτρολογούμε στη

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

Εισαγωγή στην πληροφορική

Εισαγωγή στην πληροφορική Τμήμα Μηχανικών Πληροφορικής & Τηλεπικοινωνιών Εισαγωγή στην πληροφορική Ενότητα 5: Εισαγωγή στην HTML (Μέρος Α) Αγγελίδης Παντελής Τμήμα Μηχανικών Πληροφορικής και Τηλεπικοινωνιών Άδειες Χρήσης Το παρόν

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

1. Βασικές Λειτουργίες του MS- Word

1. Βασικές Λειτουργίες του MS- Word 1. Βασικές Λειτουργίες του MS- Word Το MS-Word, που είναι και αντικείμενο αυτών των σημειώσεων είναι ένα πρόγραμμα επεξεργασίας κειμένου, που στις σελίδες του μπορεί να περιέχει εκτός από κείμενο, εικόνες

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

ΣΧΕΔΙΑΣΜΟΣ ΠΡΟΣΑΡΜΟ- ΣΤΙΚΩΝ ΙΣΤΟ- ΤΟΠΩΝ

ΣΧΕΔΙΑΣΜΟΣ ΠΡΟΣΑΡΜΟ- ΣΤΙΚΩΝ ΙΣΤΟ- ΤΟΠΩΝ ΣΧΕΔΙΑΣΜΟΣ ΠΡΟΣΑΡΜΟ- ΣΤΙΚΩΝ ΙΣΤΟ- ΤΟΠΩΝ 4.1. Εισαγωγή Το παρόν κεφάλαιο πραγματεύεται τις αρχές του προσαρμοστικού σχεδιασμού στον ιστό. Εξηγεί την ανάγκη που οδήγησε στην επινόηση του προσαρμοστικού σχεδιασμού

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

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

Σπουδές CAD, Πληροφορικής, Οικονομίας, Διοίκησης και D.T.P. με Σύστημα διδασκαλίας facetoface Copyright 2012-2015 -SYSTEM- All rights reserved 2/180 ΠΕΡΙΕΧΟΜΕΝΑ Μάθημα 1: Εισαγωγή στο Dreamwever Μάθημα 2: Γραμμές εργαλείων document Μάθημα 3: Προετοιμασία τοποθεσίας ιστού Μάθημα 4: Ορισμός τοπικής

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

Εξεταστέα Ύλη (Syllabus) Έκδοση 5.0

Εξεταστέα Ύλη (Syllabus) Έκδοση 5.0 Εξεταστέα Ύλη (Syllabus) Έκδοση 5.0 Πνευματικά Δικαιώματα 2007 Ίδρυμα ECDL (ECDL Foundation www.ecdl.org) Όλα τα δικαιώματα είναι κατοχυρωμένα. Κανένα μέρος αυτού του εγγράφου δεν μπορεί να αναπαραχθεί

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

ΕΡΓΑΣΤΗΡΙΟ FRONT PAGE 2

ΕΡΓΑΣΤΗΡΙΟ FRONT PAGE 2 ΕΡΓΑΣΤΗΡΙΟ FRONT PAGE 2 Μάθαµε στο προηγούµενο µάθηµα πώς να δίνουµε ονόµατα στις ιστοσελίδες µας, να βάζουµε χρώµα και γραφικά, ή ακόµα να δηµιουργούµε υπερσυνδέσµους σε κείµενο και εικόνες. Σήµερα µεταξύ

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

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

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

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

Γαβαλάς αµιανός

Γαβαλάς αµιανός Πανεπιστήµιο Αιγαίου Σχολή Κοινωνικών Επιστηµών Τµήµα Πολιτισµικής Τεχνολογίας Και Επικοινωνίας ικτυακά Πολυµέσα Ι (Β Έτος, 3ο εξ) Εργαστήριο #1ο: Εισαγωγή στην HTML Γαβαλάς αµιανός dgavalas@aegean.gr

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

Πανεπιστήμιο Πειραιώς Τμήμα Πληροφορικής

Πανεπιστήμιο Πειραιώς Τμήμα Πληροφορικής Πανεπιστήμιο Πειραιώς Τμήμα Πληροφορικής Πρόγραμμα Μεταπτυχιακών Σπουδών «Πληροφορική» Μεταπτυχιακή Διατριβή Τίτλος Διατριβής Ονοματεπώνυμο Φοιτητή Πατρώνυμο Ηλεκτρονικό Βιβλιοπωλείο Δημήτριος Μανώλης

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

Περιεχόμενα. Περιβάλλον ηλεκτρονικού υπολογιστή...9 Επιφάνεια εργασίας...12 Διαχείριση αρχείων...15 Ιοί Η/Υ...21 Διαχείριση εκτυπώσεων...

Περιεχόμενα. Περιβάλλον ηλεκτρονικού υπολογιστή...9 Επιφάνεια εργασίας...12 Διαχείριση αρχείων...15 Ιοί Η/Υ...21 Διαχείριση εκτυπώσεων... Περιεχόμενα Περιβάλλον ηλεκτρονικού υπολογιστή...9 Επιφάνεια εργασίας...12 Διαχείριση αρχείων...15 Ιοί Η/Υ...21 Διαχείριση εκτυπώσεων...22 Περιβάλλον ηλεκτρονικού υπολογιστή...23 Επιφάνεια εργασίας...26

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

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

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

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

Ειδικά Θέματα Προγραμματισμού

Ειδικά Θέματα Προγραμματισμού Ειδικά Θέματα Προγραμματισμού Ενότητα 5: Applets και Γραφικά Μιχάλας Άγγελος Τμήμα Μηχανικών Πληροφορικής ΤΕ Άδειες Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης Creative Commons. Για εκπαιδευτικό

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

ΕΛΛΗΝΙΚΟ ΑΝΟΙΚΤΟ ΠΑΝΕΠΙΣΤΗΜΙΟ

ΕΛΛΗΝΙΚΟ ΑΝΟΙΚΤΟ ΠΑΝΕΠΙΣΤΗΜΙΟ ΕΛΛΗΝΙΚΟ ΑΝΟΙΚΤΟ ΠΑΝΕΠΙΣΤΗΜΙΟ Εργαστήριο Εκπαιδευτικού Υλικού & Εκπαιδευτικής Μεθοδολογίας (Ε.Ε.Υ.Ε.Μ.) Πατρών Κλάους 279, 263 35 ΠΑΤΡΑ Τομέας Εκπαιδευτικού Υλικού και Περιεχομένου του ΕΕΥΕΜ 2610-642730,

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

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

ΕΙΔΙΚΟΤΗΤΑ: ΤΕΧΝΙΚΟΣ ΕΦΑΡΜΟΓΩΝ ΠΛΗΡΟΦΟΡΙΚΗΣ ΜΑΘΗΜΑ: ΕΙΣΑΓΩΓΗ ΣΤΗΝ ΠΛΗΡΟΦΟΡΙΚΗ ΕΙΔΙΚΟΤΗΤΑ: ΤΕΧΝΙΚΟΣ ΕΦΑΡΜΟΓΩΝ ΠΛΗΡΟΦΟΡΙΚΗΣ ΜΑΘΗΜΑ: ΕΙΣΑΓΩΓΗ ΣΤΗΝ ΠΛΗΡΟΦΟΡΙΚΗ (Σημειώσεις Powerpoint) ΕΚΠΑΙΔΕΥΤΕΣ: ΒΑΡΕΛΑΣ ΙΩΑΝΝΗΣ, ΠΟΖΟΥΚΙΔΗΣ ΚΩΝΣΤΑΝΤΙΝΟΣ MICROSOFT POWERPOINT (ΕΚΠΑΙΔΕΥΤΙΚΕΣ ΣΗΜΕΙΩΣΕΙΣ)

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

Οδηγίες για τη δημιουργία προσβάσιμων

Οδηγίες για τη δημιουργία προσβάσιμων Κεντρικό Μητρώο Ελληνικών Ανοικτών Μαθημάτων Οδηγίες για τη δημιουργία προσβάσιμων εγγράφων με χρήση MS Word 2010 Έκδοση 1.0 Γεώργιος Κουρουπέτρογλου koupe@di.uoa.gr Άδεια Χρήσης Το παρόν υλικό υπόκειται

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

Εισαγωγή στο MS Word

Εισαγωγή στο MS Word Εισαγωγή στο MS Word Περιεχόμενα Βασικές λειτουργίες Χρήση, μορφοποίηση στυλ Εισαγωγή στοιχείων Αρχική Οθόνη (doc) Μπάρα τίτλου Χάρακας Μπάρα Μενού Μπάρες Εργαλείων Όψη κειμένου Αρχική Οθόνη (docx) Μπάρα

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

2 η Διάλεξη: Αρχιτεκτονική Web, HTML, CSS

2 η Διάλεξη: Αρχιτεκτονική Web, HTML, CSS Σχεδίαση Εφαρμογών και Υπηρεσιών Διαδικτύου 2 η Διάλεξη: Αρχιτεκτονική Web, HTML, CSS Δρ. Απόστολος Γκάμας Διδάσκων (407/80) gkamas@uop.gr Σχεδίαση Εφαρμογών και Υπηρεσιών Διαδικτύου Διαφάνεια 1 Η αρχιτεκτονική

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

Από τις διαλέξεις του μαθήματος του Α εξαμήνου σπουδών του Τμήματος. Κ. Παπαθεοδώρου, Αναπληρωτής Καθηγητής Οκτώβριος 2013

Από τις διαλέξεις του μαθήματος του Α εξαμήνου σπουδών του Τμήματος. Κ. Παπαθεοδώρου, Αναπληρωτής Καθηγητής Οκτώβριος 2013 Συγγραφή Τεχνικών Κειμένων Το Έντυπο Από τις διαλέξεις του μαθήματος του Α εξαμήνου σπουδών του Τμήματος Πολιτικών Μηχανικών και Μηχανικών Τοπογραφίας & Γεωπληροφορικής Κ. Παπαθεοδώρου, Αναπληρωτής Καθηγητής

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

α2. Αποθήκευση παρουσίασης με διαφορετικό τύπου ή/και σε διαφορετική θέση/ ή/και με διαφορετικό όνομα

α2. Αποθήκευση παρουσίασης με διαφορετικό τύπου ή/και σε διαφορετική θέση/ ή/και με διαφορετικό όνομα Αντικείμενα Αξιολόγησης Κριτήρια Απόδοσης Δεξιότητες που θα εξεταστούν(power point ) 1. Βασικές λειτουργίες & Περιβάλλον εφαρμογής παρουσιάσεων α. Χειρισμός παρουσιάσεωνα1. Δημιουργία, άνοιγμα, Κλείσιμο,

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

Μορφοποίηση εικόνων. Εισαγωγή. Στόχος κεφαλαίου

Μορφοποίηση εικόνων. Εισαγωγή. Στόχος κεφαλαίου Περιεχόμενα Κεφάλαιο 1: Προετοιμασία παρουσίασης...1 Κεφάλαιο 2: Διαχείριση διαφανειών...18 Κεφάλαιο 3: Διαχείριση γραφικών...31 Κεφάλαιο 4: Επεξεργασία εικόνων με το Adobe Photoshop...56 Κεφάλαιο 5: Μορφοποίηση

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

ΜΑΘΗΜΑ 1 ΕΙΣΑΓΩΓΗ ΣΤΟ MACROMEDIA DREAMWEAVER MX 2004 18

ΜΑΘΗΜΑ 1 ΕΙΣΑΓΩΓΗ ΣΤΟ MACROMEDIA DREAMWEAVER MX 2004 18 Περιεχόμενα ΕΙΣΑΓΩΓΗ 13 ΜΑΘΗΜΑ 1 ΕΙΣΑΓΩΓΗ ΣΤΟ MACROMEDIA DREAMWEAVER MX 2004 18 Εξερεύνηση του χώρου εργασίας 20 Σελίδα εκκίνησης 20 Προετοιμασία για τη δημιουργία της τοποθεσίας Ιστού σας 22 Ορισμός τοπικής

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

Oι 3 πιο αγαπημένες μου ταινίες φαίνονται στον πίνακα που ακολουθεί:

Oι 3 πιο αγαπημένες μου ταινίες φαίνονται στον πίνακα που ακολουθεί: d Road to Perdition Αναμφισβήτητα μια από τις πιο αναμενόμενες ταινίες του φετινού χειμώνα, και για πολλούς λόγους. Πρώτον, ο βραβευμένος με Oscar για την σκηνοθεσία του στο American Beauty, Sam Mentes

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

Ανοιχτά Ακαδημαϊκά Μαθήματα στο ΠΑΜΑΚ

Ανοιχτά Ακαδημαϊκά Μαθήματα στο ΠΑΜΑΚ ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ ΠΑΝΕΠΙΣΤΗΜΙΟ ΜΑΚΕΔΟΝΙΑΣ Ανοιχτά Ακαδημαϊκά Μαθήματα στο ΠΑΜΑΚ Σεμινάριο Ενημέρωσης: 26 Σεπτεμβρίου 2013 Επιστημονικός Υπεύθυνος Έργου: Καθηγητής Μάνος Ρουμελιώτης Άδειες Χρήσης Το παρόν

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

Πίνακες, περιγράµµατα και σκίαση

Πίνακες, περιγράµµατα και σκίαση Πίνακες, περιγράµµατα και σκίαση Οι πίνακες Οι πίνακες είναι ορθογώνια πλαίσια που χωρίζονται σε γραµµές και στήλες. Η τοµή µιας γραµµής µε µια στήλη προσδιορίζει ένα κελί. Τα στοιχεία, που παρουσιάζουµε,

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

Ανοικτό Ψηφιακό Μάθημα για την κατάρτιση του προσωπικού υποστήριξης ανάπτυξης ψηφιακών μαθημάτων

Ανοικτό Ψηφιακό Μάθημα για την κατάρτιση του προσωπικού υποστήριξης ανάπτυξης ψηφιακών μαθημάτων Ανοικτό Ψηφιακό Μάθημα για την κατάρτιση του προσωπικού υποστήριξης ανάπτυξης ψηφιακών μαθημάτων Ενότητα 2: Οδηγίες για τη δημιουργία προσβάσιμων εγγράφων με χρήση MS Word 2010 Έκδοση 1.0 Άδειες Χρήσης

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

1. Ξεκινήστε το Microsoft Word και ανοίξτε το έγγραφο Αsia.doc από την επιφάνεια εργασίας.

1. Ξεκινήστε το Microsoft Word και ανοίξτε το έγγραφο Αsia.doc από την επιφάνεια εργασίας. Άσκηση 1 1. Ξεκινήστε το Microsoft Word και ανοίξτε το έγγραφο Αsia.doc από την επιφάνεια εργασίας. 2. Αλλάξτε την προβολή του εγγράφου σε Κανονική. 3. Επιλέξτε την κατάλληλη εντολή για κρύψετε τον οριζόντιο

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

5.1.1 Περιγραφή των συστατικών τμημάτων ενός γραφήματος

5.1.1 Περιγραφή των συστατικών τμημάτων ενός γραφήματος 5. Γραφήματα 5.1 Εισαγωγή 5.1.1 Περιγραφή των συστατικών τμημάτων ενός γραφήματος Το Discoverer παρέχει μεγάλες δυνατότητες στη δημιουργία γραφημάτων, καθιστώντας δυνατή τη διαμόρφωση κάθε συστατικού μέρους

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

ΕΡΩΤΗΣΕΙΣ WORD 2007. 2. Πώς αλλάζουμε το διάστιχο μίας παραγράφου; [Πηγαίνουμε στην παράγραφο και στην κεντρική καρτέλα πατάμε το εικονίδιο Διάστιχο]

ΕΡΩΤΗΣΕΙΣ WORD 2007. 2. Πώς αλλάζουμε το διάστιχο μίας παραγράφου; [Πηγαίνουμε στην παράγραφο και στην κεντρική καρτέλα πατάμε το εικονίδιο Διάστιχο] ΕΡΩΤΗΣΕΙΣ WORD 2007 1. Πώς βάζουμε διπλή υπογράμμιση και χρώμα υπογράμμισης; [Επιλέγουμε το κείμενο και στην κεντρική καρτέλα πατάμε στο βελάκι δίπλα στο εικονίδιο της υπογράμμισης] 2. Πώς αλλάζουμε το

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

Οδηγίες Συγγραφής Εργασιών για το 6 ο Πανελλήνιο Συνέδριο Οδικής Ασφάλειας

Οδηγίες Συγγραφής Εργασιών για το 6 ο Πανελλήνιο Συνέδριο Οδικής Ασφάλειας 6 ο Πανελλήνιο Συνέδριο Οδικής Ασφάλειας www.nrso.ntua.gr/roadsafety2015 roadsafety2015@gmail.com Οδηγίες Συγγραφής Εργασιών για το 6 ο Πανελλήνιο Συνέδριο Οδικής Ασφάλειας Όνοµα Επίθετο 1, 1 Οργανισµός

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

1.Puzzle. ΕΠΙΜΕΛΕΙΑ: ΓΕΩΡΓΙΑ ΚΛΩΣΤΡΑΚΗ Σελίδα 1

1.Puzzle. ΕΠΙΜΕΛΕΙΑ: ΓΕΩΡΓΙΑ ΚΛΩΣΤΡΑΚΗ Σελίδα 1 1.Puzzle Μόλις ανοίξω το πρόγραμμα επιλέγω την εντολή Browse. Στη συνέχεια αναζητώ την εικόνα που έχω αποθηκεύσει σε ένα φάκελο (στην επιφάνεια εργασίας ή στα έγγραφά μου ή στο σκληρό μου δίσκο). Αφού

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

Έκδοση: 1.0. με το. Ασημίνα

Έκδοση: 1.0. με το. Ασημίνα Έκδοση: 1.0 Σύντομες οδηγίες για τη δημιουργία προσβάσιμων εγγράφων με το MS-Word 20100 Ασημίνα Σπανίδου και Γεώργιος Κουρουπέτρογλου aspanidou@di.uoa.gr koupe@di.uoa.gr Έργο «Κεντρικό Μητρώο Ελληνικών

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

CSS Basic Styling. Έλαο θαλόλαο CSS (Cascading Style Sheets) απνηειείηαη από δύν θύξηα κέξε: ηελ επηινγή, θαη κία ή πεξηζζόηεξεο δηεπθξηλήζεηο:

CSS Basic Styling. Έλαο θαλόλαο CSS (Cascading Style Sheets) απνηειείηαη από δύν θύξηα κέξε: ηελ επηινγή, θαη κία ή πεξηζζόηεξεο δηεπθξηλήζεηο: Σύνταξη CSS CSS Basic Styling Έλαο θαλόλαο CSS (Cascading Style Sheets) απνηειείηαη από δύν θύξηα κέξε: ηελ επηινγή, θαη κία ή πεξηζζόηεξεο δηεπθξηλήζεηο: Επιλογή Διευκρίνηςη Διευκρίνηςη Ιδιότητα Τιμή

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