Σχεδιασµός και Ανάπτυξη Web-Site για Επιχειρήσεις

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

Download "Σχεδιασµός και Ανάπτυξη Web-Site για Επιχειρήσεις"

Transcript

1 Α.Τ.Ε.Ι. ΠΑΤΡΑΣ ΠΑΡΑΡΤΗΜΑ ΑΜΑΛΙΑ ΑΣ ΤΜΗΜΑ ΕΦΑΡΜΟΓΩΝ ΠΛΗΡΟΦΟΡΙΚΗΣ ΣΤΗ ΙΟΙΚΗΣΗ ΚΑΙ ΟΙΚΟΝΟΜΙΑ Σηµειώσεις Εργαστηρίου Σχεδιασµός και Ανάπτυξη Web-Site για Επιχειρήσεις ρ. Χριστοδούλου Σωτήριος

2 2

3 ΠΕΡΙΕΧΟΜΕΝΑ 1 Εισαγωγή Αρχές, προβλήµατα, αποφάσεις κατά την σχεδίαση Web Browsers Οθόνη χρηστών Χρήση ή µη εφαρµογών σχεδίασης Γραφικά Έλεγχος του αποτελέσµατος HTML Εισαγωγή στην HTML Tags Βασικά HTML tags Πληροφορία που αγνοούν οι Browsers Ειδικοί Χαρακτήρες και Χαρακτήρες µε Ειδικές Λειτουργίες Ειδικοί χαρακτήρες Χαρακτήρες µε Ειδικές Λειτουργίες Χρώµατα Ανάλυση της δοµής Μορφοποιήσεις κειµένου To tag <FONT> Επικεφαλίδες (Headings) Λίστες Στοίχιση Παραποµπές (Links) Άνοιγµα νέου παραθύρου Προσθέτοντας εικόνες Εικόνες και γραµµή κειµένου Απόσταση του κειµένου από µια εικόνα Η παράµετρος ALT Η παράµετρος BORDER Χρήση εικόνας ως παραποµπή Οι παράµετροι HEIGHT & WIDTH Εισαγωγή µιας εικόνας σαν φόντο της σελίδας Οριζόντιες Γραµµές <HR> Πίνακες Παράµετρος BORDER Τίτλος του πίνακα Η στοίχιση του περιεχοµένου των κελιών Περίπλοκοι πίνακες Σελιδοποίηση µε πίνακες Φόρµες επικοινωνίας Πλαίσια (frames) Πιο Περίπλοκοι Συνδυασµοί Πλαισίων Κίνηση Μεταξύ Πλαισίων iframe Image maps ιαδικασία Κατασκευής image map Animated gifs Multimedia Ηχος Βίντεο Flash Shockwave

4 4.5 Java applets Javascript Pop-Up Windows Cascading Stylesheets Κατασκευή µιας απλής σελίδας µε style sheets Τι είναι οι κανόνες (rules): Τρόποι ορισµού των style sheets Ισχύς των κανόνων Άλλα Θέµατα Ρυθµίσεις γλώσσας Meta Tags Βιβλιογραφία

5 1 Εισαγωγή Μια Web σελίδα είναι ένα αρχείο κειµένου, σε ASCII µορφή, κατασκευασµένο µε τέτοιο τρόπο που να µπορεί να παρουσιάζεται ολοκληρωµένο και στην επιθυµητή για τον δηµιουργό του µορφή, µε µία µόνο κλήση από τον χειριστή του κατάλληλου λογισµικού. Υπεύθυνος για την λήψη και παρουσίαση Web σελίδων είναι ο Web Browser (φυλλοµετρητής:internet Explorer, Netscape Communicator, Opera, Mozilla Firefox κα.). Για την εµφάνιση µιας Web σελίδας χρησιµοποιείται η διαδικτυακή διεύθυνση URL (Uniform Resource Locator). Ένα URL αποτελείται από 3 τµήµατα: α) Το πρωτόκολλο που πρέπει να χρησιµοποιήσουµε για να αποκτήσουµε αυτό το αρχείο. (http://www.culture.gr/anakoinoseis/press_gr.html) β) To web site στο οποίο είναι τοποθετηµένο το αρχείο. (http://www.culture.gr/anakoinoseis/press_gr.html) γ) Ο κατάλογος που βρίσκεται το αρχείο και το όνοµα του αρχείου. (http://www.culture.gr/anakoinoseis/press_gr.html) To Web site είναι ένα σύνολο web σελίδων (ή ενοτήτων αυτών) που είναι αποθηκευµένες σε έναν (ή περισσότερους) Web Server. Ο Web Server είναι ένας υπολογιστής ο οποίος µε την χρήση ειδικού λογισµικού εξυπηρετεί τις αιτήσεις των χρηστών. Ο υπολογιστής του χρήστη συνδέεται µε τον Web Server και µεταφέρει τα αναγκαία δεδοµένα για την εµφάνιση της Web σελίδας. Τα δεδοµένα αυτά είναι κυρίως η περιγραφή της δοµής της σελίδας, κείµενα και εικόνες. Όµως µπορεί να είναι ήχος, βίντεο και πολλά είδη πολυµεσικών εφαρµογών που παρουσιάζονται µέσω του Web browser του χρήστη και ειδικού λογισµικού. H πιο διαδεδοµένη γλώσσα περιγραφής της δοµής µιας ιστοσελίδας είναι η HTML (HyperText Markup Language). Η HTML δεν είναι γλώσσα προγραµµατισµού αλλά µια περιγραφική γλώσσα, ένας ειδικός τρόπος γραφής κειµένου και κλήσης άλλων αρχείων ή εφαρµογών βασισµένος σε οδηγίες (tags). Με την χρήση νεώτερων τεχνολογιών και γλωσσών δόθηκε η δυνατότητα στην δηµιουργία web σελίδων µε διαδραστικότητα και δυναµική εµφάνιση (Javascipt, Vbscript, DHTML) αλλά και στην δηµιουργία δυναµικού περιεχοµένου και στην υλοποίηση σύνθετων διαδικτυακών εφαρµογών (ASP, PHP κ.α). Σχήµα 1: ηµιουργία δυναµικού Web περιεχοµένου προερχόµενο από Βάση εδοµένων 5

6 2 Αρχές, προβλήµατα, αποφάσεις κατά την σχεδίαση Κατά την σχεδίαση Web σελίδων ενός Web site θα πρέπει να ληφθούν σοβαρά υπόψη τα χαρακτηριστικά των χρηστών στους οποίους απευθύνεται όπως επίσης και τα χαρακτηριστικά των υπολογιστών τους. 2.1 Web Browsers Οι χρήστες του Web πλοηγούνται µέσω των Browsers διαφόρων εταιριών αλλά και διαφόρων εκδόσεων του λογισµικού τους. Χαρακτηριστικά και τεχνολογίες (Java, Javascript, DHTML, StyleSheets, Flash) που υποστηρίζονται από κάποιον browser µπορεί να µην υποστηρίζονται από κάποιον άλλον αλλά και από µια παλιότερη έκδοση αυτού. Υπάρχουν πολλές προσεγγίσεις που απαντούν στο παραπάνω δίληµµα για την χρήση ή µη των Web τεχνολογιών µε επικρατέστερες τις παρακάτω χρησιµοποίηση των τεχνολογιών µε τέτοιο τρόπο ώστε οι σελίδες να είναι πλήρως λειτουργικές σε παλιότερες εκδόσεις των browsers βελτιώνοντας µόνο την παρουσίαση τους σε νέες εκδόσεις. σχεδίαση πολλών εκδόσεων ενός web site ώστε να καλύπτει πλήθος εκδόσεων των browsers ανάλογα µε τα χαρακτηριστικά τους. Η πλοήγηση του χρήστη σε διαφορετικές εκδόσεις συνήθως γίνεται αυτόµατα µε την χρήση εντολών Javascript. συνδυασµός των παραπάνω Ανεξάρτητα από την επιλογή των browsers και των εκδόσεων τους κλειδί για την επιτυχία είναι να γράφουµε σωστή HTML. Στο Internet υπάρχουν sites που ελέγχουν και εξακριβώνουν την ορθότητα του κώδικα HTML και την συµβατότητα του µε εκδόσεις των Browsers (π.χ. World Wide Web Consortium s HTML Validator - Επίσης κάποιες επαγγελµατικές εφαρµογές συγγραφής HTML διαθέτουν την δυνατότητα δοκιµής και ελέγχου της συµβατότητας του κώδικα HTML µε τους Browsers (Macromedia Dreamweaver, Adobe GoLive κ.α.). 2.2 Οθόνη χρηστών Το µέγεθος και η ανάλυση της οθόνης των χρηστών, το πλήθος και η πιστή αναπαραγωγή των χρωµάτων αλλά και η ποικιλία συσκευών (PC, TV, PDA, Mobile Phones) αποτελούν αντικείµενο προβληµατισµού πριν την έναρξη της σχεδίασης των σελίδων. Οι διαφορετικές αναλύσεις των οθονών των χρηστών αποτελούν σοβαρό θέµα συζήτησης όλων των επαγγελµατιών σχεδιαστών σελίδων. Το περιεχόµενο των σελίδων θα πρέπει να «χωρέσει» στην οθόνη των χρηστών (οριζόντια) αλλά και να µην αφήνει µεγάλα κενά στην οθόνη. Οι πιο κοινές (ως προς την χρήση) αναλύσεις δίνονται στον παρακάτω πίνακα PC Macintosh 640 x x x 600 (συνήθης στα laptops) 640 x x x 600 (συνήθης στα PowerBooks) 1280 x x x x x x x x

7 Επίσης ανάλογα µε το µέγεθος των οθονών ( κτλ) το κείµενο και τα γραφικά µιας σελίδας φαίνονται διαφορετικά (µικρά-µεγάλα) εξαιτίας της διαφορετικής αντιστοιχίας των pixels ανά ίντσα οθόνης. Πάντως σήµερα θεωρείται ως ελάχιστα αποδεκτή, η ανάλυση οθόνης 800x600. Οι σχεδιαστές χρησιµοποιούν δύο βασικές τεχνικές. Την σχεδίαση µε χρήση σταθερού πλάτους και τη σχεδίαση µεταβλητού πλάτους. Η σχεδίαση σελίδων σταθερού πλάτους προσφέρει καλύτερο έλεγχο και ευκολία κατά την σχεδίαση τους όµως το αποτέλεσµα δεν θα είναι επιθυµητό σε πολλά είδη οθονών. Η σχεδίαση µεταβλητού πλάτους είναι αναµφισβήτητα πιο κατάλληλη όµως είναι δύσκολο να προκαθοριστεί το αποτέλεσµα στην οθόνη του χρήστη (παράδειγµα σε οθόνες υψηλής ανάλυσης το κείµενο καλύπτει όλο το πλάτος της οθόνης, πράγµα που είναι ενοχλητικό κατά την ανάγνωση). Μερικές φορές χρησιµοποιείται και συνδυασµός των παραπάνω τεχνικών µε την σχεδίαση άλλοτε σελίδων ή µέρους αυτών σταθερού πλάτους και τη χρήση σελίδων µεταβλητού πλάτους. Η δυνατότητα αυτή είναι δυνατή µε την χρήση πινάκων και πλαισίων τα οποία θα αναλυθούν παρακάτω. Ένα άλλο πρόβληµα είναι ότι η ανάλυση της οθόνης είναι διαφορετική από το πραγµατικό µέγεθος που διαθέτει ο browser για την εµφάνιση της σελίδας. Το λειτουργικό σύστηµα, το παράθυρο του browser και το µενού του, µειώνουν το πραγµατικό διαθέσιµο χώρο. Θα πρέπει λοιπόν να ληφθούν υπόψη τα πραγµατικά µεγέθη του διαθέσιµου χώρου. Οι οθόνες προβάλλουν την πληροφορία µε 32- bit, 24-bit (17 εκ.), 16-bit (64,000) ή 8-bit (256) χρώµατα. Ο σχεδιαστής θα πρέπει να προκαθορίσει την ελάχιστη ποσότητα χρωµάτων που θα πρέπει να αναπαριστά η οθόνη του χρήστη µέσω της κάρτας γραφικών. Επειδή κάτι τέτοιο είναι δύσκολο, ο σχεδιαστής µπορεί να χρησιµοποιήσει µια παλέτα 216 χρωµάτων τα οποία ονοµάζονται web safe και έχουν την ιδιότητα να εµφανίζονται το ίδιο πιστά σε Windows και Mac συστήµατα. Άλλα θέµατα που αφορούν τη σχεδίαση είναι: η συµβατότητα µε συσκευές WebTV, PDA και συσκευές κινητής τηλεφωνίας η προσπέλαση της πληροφορίας από άτοµα µε κάποιο είδος αναπηρίας η απεικόνιση ελληνικών χαρακτήρων σε υπολογιστές που δεν διαθέτουν τις γραµµατοσειρές που ο σχεδιαστής χρησιµοποιεί. 7

8 2.3 Χρήση ή µη εφαρµογών σχεδίασης Είναι δεδοµένο ότι η χρήση λογισµικού σχεδίασης σελίδων (WYSIWYG - What You See Is What You Get) µειώνει τον χρόνο υλοποίησης, παρέχει πλήθος ευκολιών και αυτοµατισµών και βοηθά έναν αρχάριο να σχεδιάσει σε µικρό χρονικό διάστηµα τις πρώτες του σελίδες. Για επαγγελµατική χρήση όµως ο δύσκολος τρόπος δηλαδή η χρήση κώδικα HTML (µε την βοήθεια λογισµικού σύνταξης HTML) είναι επιβεβληµένη γιατί: Παρέχει µεγαλύτερη αξιοπιστία και καλύτερο έλεγχο ως προς το τελικό αποτέλεσµα. Το τελικό αποτέλεσµα µε τη χρήση λογισµικού δεν είναι πάντοτε αυτό που σχεδιάζουµε και δεν προσαρµόζεται προσαρµόζονται αυτόµατα στις ιδιαιτερότητες της οθόνης κάθε χρήστη. Το µέγεθος των σελίδων είναι µικρότερο µε συνέπεια την γρηγορότερη εµφάνιση του στην οθόνη του χρήστη. Τα προβλήµατα επιλύονται ευκολότερα επειδή κατανοούµε τα χαρακτηριστικά της σελίδας που δηµιουργούµε(π.χ. ασυµβατότητα µε κάποιους browsers) 2.4 Γραφικά Τα γραφικά και οι εικόνες αποτελούν σήµερα αναπόσπαστο κοµµάτι των web σελίδων. Τα δύο πιο διαδεδοµένα format είναι τα GIF (Graphic Interchange Format) και τα JPEG (Joint Photographic Experts Group). Τα GIF αρχεία περιέχουν το µέγιστο 256 χρώµατα ανά pixel (8- bit) και το κύριο χαρακτηριστικό τους είναι η συµπίεση της χρωµατικής πληροφορίας ανά γραµµή εικόνας. Γι αυτό επιλέγονται για την παρουσίαση γραφικών που διαθέτουν περιοχές µε ίδιο χρώµα. Τα αρχεία JPEG περιέχουν 24-bit πληροφορία χρωµάτων σε αντίθεση µε την 8-bit πληροφορία των αρχείων GIF. H συµπίεση που προκαλείται στα αρχεία είναι απωλεστική (lossy), δηλαδή κάποια πληροφορία χάνεται. Η πληροφορία αυτή πάντως είναι µηδαµινή σε σχέση µε την συµπίεση που προσφέρει. Επιπλέον ο σχεδιαστής έχει την δυνατότητα να ρυθµίσει την συµπίεση σε σχέση µε το µέγεθος του αρχείου και το επιθυµητό αποτέλεσµα. Το JPEG format χρησιµοποιείται σε φωτογραφικές εικόνες και σε εικόνες µε πολύπλοκες µεταβολές του χρώµατος. 2.5 Έλεγχος του αποτελέσµατος Πριν την διάθεση των web σελίδων στο κοινό θα πρέπει να γίνουν όσο το δυνατόν περισσότεροι έλεγχοι µε την προβολή των σελίδων σε διάφορους browsers και µε πλήθος αναλύσεων και χρωµάτων της οθόνης. Επίσης θα πρέπει να δοκιµασθεί η ταχύτητα παρουσίασης των σελίδων σε υπολογιστές που διαθέτουν χαµηλή ταχύτητα σύνδεσης µε το Internet. 8

9 3 HTML 3.1 Εισαγωγή στην HTML Τι είναι ένα αρχείο HTML; Η λέξη HTML σηµαίνει Hyper Text Mark-up Language Ένα αρχείο HTML είναι ένα αρχείο κειµένου, το οποίο περιλαµβάνει mark-up tags Τα mark-up tags καθορίζουν τον τρόπο µε τον οποίο θα εµφανιστεί η σελίδα στον Web browser Ένα αρχείο HTML πρέπει να έχει κατάληξη htm ή html Ένα αρχείο HTML µπορεί να δηµιουργηθεί χρησιµοποιώντας έναν απλό επεξεργαστή κειµένου 3.2 Tags Τα tags χρησιµοποιούνται από την HTML για να σηµατοδοτήσουν (mark-up) τα στοιχεία (elements) της σελίδας. Τα tags αποτελούνται από ένα όνοµα ακολουθούµενο προαιρετικά από παραµέτρους, µεταξύ των συµβόλων < και >. Οτιδήποτε υπάρχει µεταξύ των συµβόλων < και > δεν εµφανίζεται από τον browser. Τα περισσότερα tags αποτελούνται από το tag αρχής και το tag τέλους. Το tag τέλους περιέχει το σύµβολο / ακολουθούµενο από το όνοµα του tag αρχής και καµιά άλλη πληροφορία. Ότι περιλαµβάνεται µεταξύ του tag αρχής και του tag τέλους είναι το περιεχόµενο του στοιχείου, το οποίο και θα παρουσιαστεί από τον browser µε τον τρόπο µε τον οποίο καθορίζει το tag. Π.χ. η οδηγία για να εµφανίζεται στον browser ένα κείµενο µε έντονα γράµµατα (bold) είναι: Κανονικό κείµενο - <b>έντονο κείµενο</b> Που θα παρουσιασθεί ως: Κανονικό κείµενο - Έντονο κείµενο Σε µερικά tags το tag τέλους είναι προαιρετικό (όπως το tag παραγράφου <p>), όµως για καλύτερη κατανόηση του κώδικα HTML θα πρέπει να τοποθετείται. Κάποια tags δεν έχουν tag τέλους γιατί χρησιµοποιούνται για να τοποθετήσουν κάποιο στοιχείο στο περιεχόµενο όπως το tag αλλαγής γραµµής (<br>) ή το tag εικόνας (<img>). Επίσης τα HTML tags δεν είναι case-sensitive. Παράµετροι των tags Τα tags µπορούν να έχουν παραµέτρους. Οι παράµετροι µπορούν να παρέχουν επιπρόσθετη πληροφορία σχετικά µε τα HTML στοιχεία στην σελίδα µας. Οι παράµετροι ενός tag ακολουθούν το όνοµα του tag. Αν η παράµετρος δέχεται τιµές τότε το όνοµα της ιδιότητας ακολουθείται µε το σύµβολο = και την τιµή της παραµέτρου. Για παράδειγµα, εάν στο tag <body> προσθέσουµε την παράµετρο bgcolor=blue (δηλ. <body bgcolor=blue>). Οι τιµές των παραµέτρων είτε περικλείονται από εισαγωγικά (µονά ή διπλά) είτε γράφονται αυτούσιες. Όταν η τιµή αποτελείται από γράµµατα (a-z), αριθµούς (0-9) και τα σύµβολα (ειδικούς χαρακτήρες) τελεία (.) και αφαίρεση ( ) τότε δεν χρειάζονται εισαγωγικά. Αντιθέτως όταν οι τιµές περιλαµβάνουν τα σύµβολα κόµµα (,), κενό ή άλλους ειδικούς χαρακτήρες τότε θα πρέπει να περικλείονται από εισαγωγικά. Tα URLs για παράδειγµα θα πρέπει να περικλείονται από εισαγωγικά γιατί περιέχουν τους χαρακτήρες ://. Αν τοποθετούνται εισαγωγικά παντού δεν είναι λάθος και συνίσταται στην περίπτωση που δεν θυµόµαστε αν απαιτούνται ή όχι. Το όνοµα των tags και των παραµέτρων τους δεν επηρεάζεται από το αν έχει γραφτεί µε πεζά (µικρά) ή κεφαλαία (case insensitive). ηλαδή οι οδηγίες <body bgcolor=white> και <BODY 9

10 BGCOLOR=white> είναι ισοδύναµες. Τις περισσότερες περιπτώσεις ισχύει το ίδιο µε τις τιµές των παραµέτρων αλλά όχι πάντα ιδίως όταν αναφερόµαστε σε URLs και ονόµατα αρχείων. Τα παρακάτω είναι παράδειγµα χρήσης των tags µε παραµέτρους <IMG SRC="images/pixie.gif" ALIGN=right WIDTH=45 HEIGHT=60> <BODY BGCOLOR="#00ff00"> <FONT FACE="Trebuchet MS, Arial, Helvetica" SIZE=2> Tags µπορεί να περικλείουν άλλα tags σε κάποιο στοιχείο ώστε να του δώσουν πολλαπλές ιδιότητες. Τα tags τα οποία περιλαµβάνονται σε άλλα tags ονοµάζονται εµφωλευµένα (nested). Π.χ. Ο καιρός είναι <B><I>υπέροχος</I></B>σήµερα. Θα έχει ως αποτέλεσµα την εµφάνιση: Ο καιρός είναι υπέροχος σήµερα. Σύνηθες λάθος είναι η υπερπήδηση των tags (το tag τέλους </Β> προηγείται του tag τέλους </I>) Ο καιρός είναι <B><I>υπέροχος</B></I> σήµερα. Οι browsers συνήθως διορθώνουν το λάθος κατά την εµφάνιση όµως αυτό δεν ισχύει στο σύνολο των browsers και των tags Βασικά HTML tags Επικεφαλίδες Οι επικεφαλίδες δηλώνονται στην HTML µε τα tags από <h1> έως <h6>. Το <h1> δηλώνει την µεγαλύτερη επικεφαλίδα, ενώ το <h6> δηλώνει τη µικρότερη. <h1>this is a heading</h1> <h2>this is a heading</h2> <h3>this is a heading</h3> <h4>this is a heading</h4> <h5>this is a heading</h5> <h6>this is a heading</h6> Η HTML εισάγει αυτόµατα µία κενή γραµµή έπειτα από κάθε tag επικεφαλίδας. Παράγραφοι Οι παράγραφοι δηλώνονται µε το tag <p>. <p>this is a paragraph</p> Αλλαγή γραµµής (Line Break) Για να αλλάξουµε γραµµή, χωρίς να αλλάξουµε παράγραφο τοποθετούµε το tag <br>. Το <br> tag είναι ένα άδειο tag το οποίο δεν χρειάζεται κλείσιµο (</br>). <p>this <br> is a para<br>graph with line breaks</p> Σχόλια στην HTML Για να τοποθετήσετε σχόλια σε ένα αρχείο HTML µπορείτε να χρησιµοποιήσετε το tag σχολίων, το οποίο ανοίγει <!-- και κλείνει -->. Ότι υπάρχει µεταξύ αυτών των tags αγνοείται από τον Web Browser. 10

11 3.2.2 Πληροφορία που αγνοούν οι Browsers Συγκεκριµένη πληροφορία αλλά και ορισµένα tags που περιλαµβάνονται στο έγγραφο HTML αγνοούνται από τον browser. 1) Αλλαγή γραµµής. Το κείµενο και άλλα στοιχεία θα καλύψουν την γραµµή µέχρι να γεµίσει ο διαθέσιµος χώρος ή να περιληφθεί το tag <p> (αλλαγή παραγράφου) και <br> (αλλαγής γραµµής). 2) ιάστιχα και πολλαπλά κενά. Τα διάστιχα (tab) απεικονίζονται ως ένας κενός χαρακτήρας (space) ενώ πολλαπλά κενά απεικονίζονται ένα κενό. Π.χ. το κείµενο πολύ, πολύ µακριά θα εµφανιστεί: πολύ, πολύ µακριά 3) Για την εισαγωγή κενών χαρακτήρων χρησιµοποιείται η οντότητα (nonbreaking space). 4) Πολλαπλά tags παραγράφου (<p>) εµφανίζονται ως ένα tag 5) Το κείµενο που περικλείεται µεταξύ της ακολουθίας <!-- και --> δεν λαµβάνεται υπόψη και χρησιµοποιείται για να εισάγουµε σηµειώσεις στο HTML έγγραφο, π.χ. <!-- Οι σηµειώσεις µου --> 6) Άγνωστα tags: Tags τα οποία είναι άγνωστα ή έχουν ορισθεί µε λανθασµένο τρόπο αγνοούνται από τον browser. Μερικές φορές ανάλογα µε τον Browser και το tag µπορεί αυτό να εµφανισθεί αυτούσιο. 3.3 Ειδικοί Χαρακτήρες και Χαρακτήρες µε Ειδικές Λειτουργίες Ειδικοί χαρακτήρες Υπάρχουν ειδικοί χαρακτήρες που δεν µπορούν να απεικονισθούν µε απλές πληκτρολογήσεις (πατώντας ένα πλήκτρο ή το Shift και ένα πλήκτρο) αλλά µόνο µε πιο περίπλοκους τρόπους (π.χ. πατώντας το Alt και έναν αριθµό). Πρόκειται για χαρακτήρες που δεν ανήκουν στο κλασικό 7-bit ASCII character set αλλά στο επεκταµένο 8-bit ASCII. Οι περισσότεροι browsers αναγνωρίζουν αυτούς τους ISO-Latin-1 (ISO ) χαρακτήρες αλλά µε ειδικό τρόπο. Για να αναγνωρίσουν τους χαρακτήρες αυτούς οι browsers όσων βλέπουν τις σελίδες µας θα πρέπει να γραφούν µε ειδικό τρόπο (µε έναν κωδικό που αρχίζει µε το & και τελειώνει µε το ;). Π.χ. το copyright είναι ενώ το γράφεται σαν Χαρακτήρες µε Ειδικές Λειτουργίες Για να εµφανίσουµε ειδικούς χαρακτήρες οι οποίοι περιλαµβάνονται στον ορισµό των tags θα πρέπει να χρησιµοποιήσουµε ειδικούς συµβολισµούς. Πχ. την εντολή <B>15<7</B> κάποιοι Browsers την αναγνωρίζουν κανονικά ενώ κάποιοι την προσπερνούν γιατί αδυνατούν να την ερµηνεύσουν). Για τον λόγο αυτό οι ειδικοί χαρακτήρες που περιέχονται στις οδηγίες (tags) όταν θέλουµε να τα δούµε µέσα σε µια σελίδα σαν απλοί χαρακτήρες, πρέπει να απεικονιστούν ως εξής: Χαρακτήρας Συµβολισµός < < > > & & " " Το ίδιο ισχύει και µε την απεικόνιση ειδικών χαρακτήρων όπως το σύµβολο (Copyright). Για τους χαρακτήρες αυτούς η απεικόνιση τους γίνεται µε την χρήση ειδικού ονόµατος ή αριθµού που ακολουθούν το σύµβολο & και ακολουθούνται από ερωτηµατικό. Παράδειγµα το σύµβολο αναγράφεται ως ή 11

12 3.4 Χρώµατα Αν θέλουµε να ορίσουµε το χρώµα λεκτικά (π.χ.<body BGCOLOR=όνοµα χρώµατος>) τότε θα χρησιµοποιήσουµε το όνοµα του (black, white, green, maroon, olive, navy, purple, gray, red, yellow, blue, teal, lime, aqua, fuchsia, silver). Για µεγαλύτερη ποικιλία σε χρώµατα και αποχρώσεις, χρησιµοποιούµε τον δεκαεξαδικό κωδικό <BODY BGCOLOR="ο κωδικός"> (σε εισαγωγικά ) του κάθε χρώµατος (π.χ. το #934CE8 είναι µια απόχρωση του πράσινου). Ο δεκαεξαδικός κωδικός αποτελείται από τρεις δυάδες χαρακτήρων που αντιστοιχούν στα τρία χρώµατα RGB (Red-Green-Blue) και αποτελείται από τους χαρακτήρες 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F που αντιστοιχούν στους αριθµούς 0 έως 15 του δεκαδικού συστήµατος. Τα χρώµατα στον υπολογιστή έχουν την ιδιαιτερότητα ότι µερικά από αυτά δεν απεικονίζονται ακριβώς το ίδιο σε κάθε browser, ή οθόνη υπολογιστή. Τα χρώµατα που απεικονίζονται ακριβώς το ίδιο ανεξάρτητα του υπολογιστή ή του browser, ονοµάζονται web-safe χρώµατα. Τα web-safe χρώµατα αποτελούνται από συνδυασµό των ακόλουθων δυάδων: 00, 33, 66, 99, CC, FF Για να τη δεκαεξαδική απεικόνιση του κάθε χρώµατος θα πρέπει να διαθέτουµε ένα πρόγραµµα γραφικών. Για παράδειγµα, µε το Paint των Windows επιλέγουµε Colors - Edit Colors - Define Custom Colors. Στο δεξιό µέρος του παραθύρου υπάρχει µια µπάρα και αριστερά της ένα µεγάλο τετράγωνο µε διάφορα χρώµατα. Κάνοντας κλικ µέσα στο µεγάλο τετράγωνο µε τα πολλά χρώµατα και µετακινώντας το δείκτη της µπάρας που βρίσκεται δεξιά από το µεγάλο τετράγωνο ορίζουµε το χρώµα και τη φωτεινότητα αυτού του χρώµατος στο σηµείο που υπάρχει χρώµα της αρεσκείας. Στο κάτω δεξιά µέρος του παραθύρου αναγράφονται οι τιµές R (Red) G (Green) και B (Blue) του χρώµατος που επιλέχθηκε. Στη συνέχεια µετατρέπουµε τον δεκαδικό αριθµό σε δεκαεξαδικό (π.χ. µε την χρήση αριθµοµηχανής των Windows) διότι αυτός πρέπει να οριστεί µέσα στον HTML κώδικα. Οι εφαρµογές συγγραφής web σελίδων µετατρέπουν αυτόµατα την χρωµατική µας επιλογή στον αντίστοιχο δεκαεξαδικό αριθµό. Για παράδειγµα: Το RGB 62,199,41 του παραπάνω παραδείγµατος είναι το 3ec729 σε δεκαεξαδικό κωδικό και το χρώµα που µας δίνει είναι το: <FONT COLOR= #3ec729 >ανοικτό πράσινο</font> 12

13 3.5 Ανάλυση της δοµής Όπως προαναφέρθηκε τα βασικά µέρη µιας σελίδας είναι η κεφαλίδα (head) και το σώµα (body). Η πιο απλή δοµή περιλαµβάνει τον ακόλουθο κώδικα. <HTML> <HEAD> <TITLE>Τίτλος εγγράφου</title> </HEAD> <BODY> Περιεχόµενο εγγράφου </BODY> </HTML> Η κεφαλίδα του εγγράφου καθορίζεται από το tag <HEAD>. Η κεφαλίδα περιλαµβάνει πρωτίστως τον τίτλο του εγγράφου που εµφανίζεται στο πάνω µέρος του browser. O τίτλος καθορίζεται από το tag <TITLE>. Επιπλέον η κεφαλίδα περιλαµβάνει και άλλα χρήσιµα tags (όπως <base> <link> <meta> <script> <style>) τα οποία και θα αναλυθούν σε άλλα κεφάλαια. Το σώµα του εγγράφου καθορίζεται από το tag <BODY> και περιλαµβάνει το περιεχόµενο που θα εµφανισθεί στον browser. Στο tag µπορούν να ορισθούν παράµετροι οι οποίες προσδιορίζουν χαρακτηριστικά όλου του εγγράφου. Για το χρώµα του κειµένου υπάρχουν οι παρακάτω παράµετροι: TEXT LINK VLINK ALINK Καθορίζει το χρώµα του κειµένου Καθορίζει το χρώµα του κειµένου που κρύβει µια παραποµπή που δεν έχουµε ακολουθήσει ακόµη (η default παράµετρος είναι µπλε) Καθορίζει το χρώµα του κειµένου που κρύβει µια παραποµπή που έχει ακολουθηθεί στο παρελθόν (η default παράµετρος είναι κόκκινο) Καθορίζει το χρώµα του κειµένου µιας επιλεγµένης παραποµπής. ηλαδή έχουµε πατήσει τοποθετήσει τον δροµέα επάνω της, έχουµε πατήσει το αντίστοιχο πλήκτρο του ποντικιού, αλλά δεν το έχουµε ακόµη αφήσει (το κρατάµε πατηµένο). Η default παράµετρος είναι συνήθως κόκκινο. Για το χρώµα φόντου του όλου εγγράφου υπάρχει η παράµετρος BGCOLOR. Π.χ. <BODY BGCOLOR=RED TEXT=WHITE LINK=BLUE VLINK=YELLOW ALINK=BLACK> Επίσης ως φόντο µπορεί να χρησιµοποιηθεί κάποια εικόνα η οποία καθορίζεται από την παράµετρο BACKGROUND Π.χ. <BODY BACKGROUND="background.gif"> Τέλος ορίζουµε το περιθώριο του περιεχόµενου (ύψος και πλάτος) από το διαθέσιµο πλαίσιο του browser και στις 4 πλευρές του. Οι παράµετροι είναι leftmargin και rightmargin (αριστερό και δεξιό περιθώριο) και topmargin και bottommargin (άνω και κάτω περιθώριο). Επειδή κάποιοι browsers χρησιµοποιούν τις ονοµασίες marginwidth και marginheight προσδιορίζουµε και τις 4 αυτές παραµέτρους ώστε να είναι κατανοητές από όλους τους browsers. Η µονάδα µέτρησης είναι σε pixels. Π.χ. <BODY MARGINWIDTH=0 MARGINHEIGHT=0 LEFTMARGIN=0 TOPMARGIN=0> 13

14 3.6 Μορφοποιήσεις κειµένου Οι βασικότερες µορφοποιήσεις που χρησιµοποιούνται στο κείµενο είναι οι παρακάτω: <B>...</B> BOLD - Bold κείµενο <I>...</I> ITALIC - Italic κείµενο <U>...</U> UNDERLINE - Υπογραµµισµένο κείµενο Αν θέλουµε να δώσουµε έµφαση σε κάποιο κείµενο το περικλείουµε µε το tag <EM> (συνήθως παρουσιάζεται στον browser σαν µια µορφή italic) <EM>...</EM> ΕΜΦΑΣΗ Αν θέλουµε να δώσουµε έµφαση σε κάποιο κείµενο (µε διαφορετικό όµως τρόπο από την <EM>) το περικλείουµε µε το tag <STRONG> (συνήθως παρουσιάζεται στον browser σαν µια µορφή bold) <STRONG>...</STRONG> ΠΕΡΙΣΣΟΤΕΡΗ ΕΜΦΑΣΗ Με το <CODE>...</CODE> το κείµενο απεικονίζεται µε courier γραµµατοσειρά (όπως οι χαρακτήρες σε ASCII τερµατικό). Χρησιµοποιείται κυρίως για να απεικονιστούν εντολές Η/Υ. <SAMP>...</SAMP>: (Παρόµοια µε την <CODE>) <TT>...<TT/>: Κείµενο γραµµένο µε courier γραµµατοσειρά <BIG>...</BIG>: Κείµενο γραµµένο µε µεγαλύτερα γράµµατα από ότι η γραµµατοσειρά στην οποία είναι γραµµένο το κείµενο που το περιβάλει. <SMALL>...</SMALL>: Αντίθετη της <BIG> <S>...</S> STRIKE THROUGH: Κάθε γράµµα διαπερνάται από µια οριζόντια γραµµή <SUB>...</SUB> SUBSCRIPT: Κείµενο που τοποθετείται ελάχιστα πιο κάτω από το επίπεδο των υπολοίπων γραµµάτων της γραµµής (χρήσιµο για απεικόνιση του παρονοµαστή ενός κλάσµατος). <SUP>...</SUP> SUPERSCRIPT: Κείµενο που τοποθετείται ελάχιστα πιο πάνω από το επίπεδο των υπολοίπων γραµµάτων της γραµµής (χρήσιµο για απεικόνιση του αριθµητή ενός κλάσµατος). <PRE>...</PRE>: Κείµενο που θα παρουσιαστεί όπως είναι µορφοποιηµένο σε ASCII (δεν θα χαθούν τα διαστήµατα µεταξύ των λέξεων). Μερικοί browsers ίσως να έχουν πρόβληµα στην απεικόνιση των Ελληνικών που βρίσκονται µέσα στην <PRE> αν δεν έχουν ρυθµιστεί σωστά τα Ελληνικά στην παράµετρο fixed font των ρυθµίσεων του Browser. <ADDRESS>...</ADDRESS>: Ειδική γραµµατοσειρά (συνήθως italic) που την χρησιµοποιούµε για να γράψουµε µια διεύθυνση (συνήθως πρόκειται για την υπογραφή του δηµιουργού της σελίδας) 14

15 3.6.1 To tag <FONT> Το FONT tag χρησιµοποιείται για τον καθορισµό της γραµµατοσειράς, του χρώµατος και του µεγέθους του κειµένου το οποίο περικλείει. <FONT SIZE=x>...</FONT> Καθορίζει το µέγεθος των γραµµάτων. Σε παλαιότερους browsers, το x µπορεί να πάρει τιµές από 1 (η µικρότερη) µέχρι 7 (η µεγαλύτερη). Default x=3. Η <FONT> µπορεί να πάρει και σχετικές τιµές (από -3 έως +4) που καθορίζουν το µέγεθός της σε σχέση µε την προκαθορισµένη γραµµατοσειρά που έχει οριστεί στον browser. Σε νεότερους browsers, το x µπορεί να πάρει και µεγαλύτερες τιµές. Απόλυτη τιµή Σχετική τιµή <FONT COLOR=x>...</FONT> Καθορίζει το χρώµα γραµµάτων <FONT FACE="x">...</FONT> Καθορίζει την γραµµατοσειρά, δίνοντας τη δυνατότητα χρησιµοποίησης κάποιας άλλης αν δεν υπάρχει στον υπολογιστή η πρώτη επιλογή. Αποτελείται από το όνοµα µιας γραµµατοσειράς ή περισσότερων διαχωρισµένες µε κόµµα (,). Καλό είναι να χρησιµοποιείται µε φειδώ διότι αν η γραµµατοσειρά δεν υπάρχει στον Η/Υ του αναγνώστη των σελίδων µπορεί να υπάρξουν προβλήµατα (π.χ. να µην φαίνονται τα κείµενα µε Ελληνικούς χαρακτήρες). Παράδειγµα: <FONT FACE="Verdana, Arial, sans-serif">κείµενο</font> Καλύτερα να αποφεύγεται η υπερβολική χρήση της <FONT> (ορισµός πολλών γραµµατοσειρών ή/και πολλών χρωµάτων γραµµάτων στο ίδιο κείµενο) διότι δίνει πολύ άσχηµη εικόνα Επικεφαλίδες (Headings) To tag επικεφαλίδας καθορίζει το µέγεθος των γραµµάτων της επικεφαλίδας και ισχύει ανεξάρτητα από την γραµµατοσειρά που χρησιµοποιεί ο browser για να διαβάζει την σελίδα. Η µεγαλύτερη σε µέγεθος επικεφαλίδα είναι η <H1>, ακολουθούµενη από τις <H2>...<H6>. Παραδείγµατα: <H1>Αυτή είναι η µεγαλύτερη επικεφαλίδα</h1> <H2>Αυτή είναι η δεύτερη µεγαλύτερη επικεφαλίδα</h2> Μια επικεφαλίδα αφήνει αυτόµατα την επόµενη γραµµή από αυτήν κενή. Έτσι υπάρχει πάντα µια γραµµή απόσταση µεταξύ της επικεφαλίδας και του κειµένου που την ακολουθεί Λίστες Αριθµηµένες λίστες Αν θέλουµε να δηµιουργήσουµε µια αριθµηµένη λίστα του τύπου 1. ευτέρα 2. Τρίτη 3. Τετάρτη 4. Πέµπτη θα πρέπει να χρησιµοποιήσουµε τα tags <OL>...</OL> και <LI> 15

16 Το tag <OL> (Ordered List) τοποθετείται στην αρχή της λίστας ενώ το tag </OL> στο τέλος της. Κάθε νέα εγγραφή στην λίστα πρέπει να σηµειώνεται µε το tag <LI> (οδηγία </LI> δεν χρησιµοποιούµε για τον ίδιο λόγο που δεν χρησιµοποιούµε το </P>) Έτσι η παραπάνω αριθµηµένη λίστα θα πρέπει να γραφτεί ως εξής: <OL><LI> ευτέρα <LI> Τρίτη <LI> Τετάρτη <LI> Πέµπτη </OL> Η αρίθµηση αφορά τις τιµές 1,2 ως προεπιλογή. Το στυλ αρίθµησης µπορεί να αλλάξει χρησιµοποιώντας την ιδιότητα TYPE η οποία δέχεται τις ακόλουθες τιµές: 1 (αριθµοί), A (κεφαλαία γράµµατα), a (πεζά γράµµατα), I (κεφαλαία λατινικά), and i (πεζά λατινικά). I. ευτέρα II. Τρίτη III. Τετάρτη IV. Πέµπτη <OL TYPE=I> <LI> ευτέρα <LI> Τρίτη <LI> Τετάρτη <LI> Πέµπτη </OL> Επίσης µπορούµε να καθορίσουµε τον εναρκτήριο αριθµό της αρίθµησης µε την παράµετρο START 3. ευτέρα 4. Τρίτη 5. Τετάρτη 6. Πέµπτη <OL START=3> <LI> ευτέρα <LI> Τρίτη <LI> Τετάρτη <LI> Πέµπτη </OL> Λίστες χωρίς αρίθµηση (Unordered Lists) Για να δηµιουργήσουµε µια λίστα µε κουκίδες όπως η παρακάτω θα ακολουθήσουµε την ίδια ακριβώς µεθοδολογία όπως και µε τις αριθµηµένες µε την διαφορά πως αντί για την οδηγία <OL> θα χρησιµοποιήσουµε την <UL>. ευτέρα Τρίτη Τετάρτη Πέµπτη Έτσι η παραπάνω µη αριθµηµένη λίστα θα πρέπει να γραφτεί ως εξής: <UL><LI> ευτέρα <LI> Τρίτη <LI> Τετάρτη <LI> Πέµπτη </UL> Τα ενδεικτικά σηµάδια κάθε µέρους µιας µη αριθµηµένης λίστας µπορούν να οριστούν µε ειδικές παραµέτρους και να πάρουν τις εξής µορφές: ίσκος (UL TYPE=DISC), Κύκλος (UL TYPE=CIRCLE), Τετράγωνο (UL TYPE=SQUARE). 16

17 Λίστες µέσα σε άλλες λίστες εν υπάρχει κανένα πρόβληµα αν θέλετε να συµπεριλάβετε µια λίστα µέσα σε µια άλλη. Για παράδειγµα, η παρακάτω διάταξη: Στερεά Ελλάδα Ιόνιοι Νήσοι o Κέρκυρα o Λευκάδα o Ζάκυνθος o Κεφαλονιά o Ιθάκη Ήπειρος o Άρτα o Ιωάννινα o Πρέβεζα o Ηγουµενίτσα Μακεδονία Θράκη θα πρέπει να έχει καταχωρηθεί µε τον ακόλουθο τρόπο: <UL> <LI> Στερεά Ελλάδα <LI> Ιόνιοι Νήσοι <UL><LI> Κέρκυρα <LI> Λευκάδα <LI> Ζάκυνθος <LI> Κεφαλονιά <LI> Ιθάκη </UL> <LI> Ήπειρος <UL><LI> Άρτα <LI> Ιωάννινα <LI> Πρέβεζα <LI> Ηγουµενίτσα </UL><LI> Μακεδονία <LI> Θράκη </UL> Λίστες ορισµού Η τρίτη κατηγορία λιστών περιλαµβάνει τις λίστες ορισµού (definition lists). Αυτές αποτελούνται από όρους και τον ορισµό τους Παράδειγµα: ΑΕΙ ΤΕΙ ΙΕΚ Ανώτατα Εκπαιδευτικά Ιδρύµατα Τεχνολογικά Εκπαιδευτικά Ιδρύµατα Ινστιτούτα Επαγγελµατικής Κατάρτισης Οι λίστες ορίζονται µε το tag <dl>, οι όροι µε το tag <dt> και οι ορισµοί µε το tag <dd> H παραπάνω λίστα καταχωρείται µε τον ακόλουθο τρόπο: <DL> <DT>ΑΕΙ <DD>Ανώτερα Εκπαιδευτικά Ιδρύµατα. <DT>ΤΕΙ <DD>Τεχνολογικά Εκπαιδευτικά Ιδρύµατα <DT>ΙΕΚ <DD>Ινστιτούτα Επαγγελµατικής Κατάρτισης </DL> 17

18 3.6.4 Στοίχιση Η στοίχιση κειµένου ή φωτογραφιών γίνεται µε την παράµετρο ALIGN. Σηµειώνεται ότι η παράµετρος ALIGN δεν είναι tag αλλά παράµετρος κάποιου tag Για τη στοίχιση κειµένου αριστερά (ALIGN=LEFT), δεξιά (ALIGN=RIGHT), ή στο κέντρο (ALIGN=CENTER) χρησιµοποιείται η ALIGN µέσα σε µια παράγραφο <p>. Για τη στοίχιση κειµένου µιας επικεφαλίδας, χρησιµοποιείται η παράµετρος ALIGN ως εξής: <H1 ALIGN=Χ>κείµενο</H1> Όπου η Χ µπορεί να πάρει τις τιµές LEFT CENTER RIGHT ανάλογα µε την θέση που θέλουµε να βρίσκεται. Το tag <div> µπορεί να περιλαµβάνει µεγάλα κοµµάτια περιεχοµένου (παραγράφους, πίνακες, εικόνες κ.α). Η παράµετρος ALIGN επηρεάζει όλο το περιεχόµενο που περικλείει το tag <div>. Παράδειγµα: <DIV ALIGN=RIGHT><H1>Επικεφαλίδα 1</H1><H3>Επικεφαλίδα 2</H3><P>Παράγραφος µε κείµενο</div> Στοίχιση στο κέντρο Το tag <CENTER>...</CENTER> στοιχίζει στο κέντρο όλα όσα περικλείει (πίνακες, εικόνες, κείµενο κ.λπ.). Αν και θεωρείται πιο σωστό να χρησιµοποιούµε την ALIGN γι' αυτή την εργασία, υπάρχουν πολλές περιπτώσεις που η <CENTER> αποδεικνύεται προτιµότερη. 3.7 Παραποµπές (Links) Οι σύνδεσµοι αποτελούν απαραίτητο στοιχείο των Web σελίδων γιατί συνδέουν τις σελίδες δίνοντας µας την δυνατότητα να µεταβούµε από µια σελίδα σε άλλη και από έναν δικτυακό τόπο σε έναν άλλο. Η γενική σύνταξη µια παραποµπής είναι: <A HREF="URL">κείµενο της παραποµπής</a> Ανάλογα µε το είδος µετάβασης διακρίνονται οι παρακάτω περιπτώσεις: 1) Παραποµπές από µια σελίδα σε µια άλλη που βρίσκεται σε έναν διαφορετικό κόµβο στο Internet Ο κώδικας θα είναι: Το <A HREF="http://www.yahoo.com">Yahoo!</A> είναι το πιο δηµοφιλές εργαλείο αναζήτησης. Αυτό που θα βλέπει ο χρήστης θα είναι: Το Yahoo! είναι το πιο δηµοφιλές εργαλείο αναζήτησης. Με κλικ πάνω στην λέξη Yahoo! ο browser θα καλεί την σελίδα 18

19 2) Παραποµπές από µια σελίδα σε µια άλλη του ίδιου κόµβου που βρίσκεται στον ίδιο φάκελο (directory) Αν η σελίδα στην οποία παραπέµπουµε είναι στο ίδιο directory (folder) µε αυτή η οποία έχει την παραποµπή, ο κώδικας θα είναι: <A HREF="όνοµα αρχείου">κείµενο παραποµπής</a> Για παραποµπή στο αρχείο secondpage.htm ο κώδικας θα είναι: Κάντε κλικ <A HREF="secondpage.htm">εδώ</A> για να πάτε στην άλλη σελίδα. Αυτό που θα βλέπει ο χρήστης θα είναι: Κάντε κλικ εδώ για να πάτε στην άλλη σελίδα. Με κλικ πάνω στην λέξη εδώ ο browser θα καλεί την σελίδα µε όνοµα αρχείου mypage.htm 3) Παραποµπές από µια σελίδα σε µια άλλη του ίδιου κόµβου που βρίσκεται σε κάποιον υποφάκελο υποφάκελο (subdirectory) Η γενική σύνταξη είναι: <a href="υποφάκελος/secondpage.htm"> υπογραµµισµένο κείµενο</a> Παράδειγµα: Υποθέτουµε πως η αρχική µας σελίδα έχει όνοµα firstpage.htm και βρίσκεται στην θέση c:\wwwroot\mypages\dance\tango Μια δεύτερη σελίδα έχει όνοµα secondpage.htm και βρίσκεται στην θέση c:\wwwroot\mypages\dance\tango\argentine Η παραποµπή από την firstpage.htm στην secondpage.htm θα είναι <a href="argentine/secondpage.htm">υπογραµµισµένο κείµενο</a> Αν η firstpage.htm βρίσκεται στην θέση c:\wwwroot\mypages\dance\tango\argentine\evita Η παραποµπή από την firstpage.htm στην secondpage.htm θα είναι <a href="argentine/evita/secondpage.htm">υπογραµµισµένο κείµενο</a> 4) Παραποµπές από µια σελίδα σε µια άλλη του ίδιου κόµβου που βρίσκεται σε ανώτερο φάκελο (directory) Η γενική σύνταξη είναι: <a href="../secondpage.htm">υπογραµµισµένο κείµενο</a> ( εν υπάρχει λόγος να βάλουµε το όνοµα του ανώτερου φακέλου διότι κάθε φάκελος έχει µόνον έναν αµέσως ανώτερο. Γι' αυτό αρκούν οι δύο τελείες). Παράδειγµα: 19

20 Υποθέτουµε πως η αρχική µας σελίδα έχει όνοµα secondpage.htm και βρίσκεται στην θέση c:\wwwroot\mypages\dance\tango\argentine Μια δεύτερη σελίδα έχει όνοµα firstpage.htm και βρίσκεται στην θέση c:\wwwroot\mypages\dance\tango Η παραποµπή από την secondpage.htm στην firstpage.htm θα είναι: <a href="../firstpage.htm">υπογραµµισµένο κείµενο</a> Αν η secondpage.htm βρίσκεται στην θέση c:\wwwroot\mypages\dance\tango\argentine\evita Η παραποµπή από την secondpage.htm στην firstpage.htm θα είναι <a href="../../ firstpage.htm">υπογραµµισµένο κείµενο</a> 5) Παραποµπές από µια σελίδα σε µια άλλη του ίδιου κόµβου που βρίσκεται σε άλλο (γενικά) φάκελο (directory) Η σύνταξη της παραποµπής αυτής είναι ένας συνδυασµός των άλλων βηµάτων 3 και 4. Για παράδειγµα έστω πως έχουµε τις σελίδες: firstpage.htm στην διεύθυνση c:\wwwroot\mypages\dance\tango\argentine\evita secondpage.htm στην διεύθυνση c:\wwwroot\mypages\dance\mambo\cuba\ Η παραποµπή από την firstpage.htm στην secondpage.htm θα είναι: <A HREF="../../mambo/cuba/secondpage.htm"> υπογραµµισµένο κείµενο</a> Η παραποµπή αυτή σηµαίνει: Από τον τρέχοντα φάκελο (evita) ανέβα στον ανώτερο (../ δηλαδή τον argentine). Μετά ανέβα στον αµέσως ανώτερο (../ δηλαδή τον tango). Από εκεί θα πας στον mambo. Από αυτόν θα πας στον cuba όπου θα βρεις το αρχείο firstpage.htm Σηµείωση: Στις περιπτώσεις 2, 3, 4, 5 χρησιµοποιούµε σχετικά (relative) links. ηλαδή οι παραποµπές δεν γίνονται µε το απόλυτο µονοπάτι (path) 1 : από το c:\wwwroot\mypages\dance\tango στο c:\wwwroot\mypages\dance\tango\argentine\evita Γίνονται µε το σχετικό: από τον τρέχοντα φάκελο (που είναι ο tango) στον αµέσως κατώτερό του (που είναι ο argentine). Ο τρόπος αυτός είναι ο ενδεδειγµένος διότι µας επιτρέπει χωρίς πρόβληµα να µεταφέρουµε ολόκληρο το site από µηχάνηµα σε µηχάνηµα (ή από φάκελο σε φάκελο) χωρίς να χρειαστεί καµία απολύτως µεταβολή. 1 Σε περίπτωση που θέλουµε να κάνουµε αναφορά (link) σε ένα αντικείµενο (σελίδα, φωτογραφία κλπ) το οποίο βρίσκεται σε έναν σταθερό ως προς τον αρχικό κατάλογο του κόµβου µας, τότε χρησιµοποιούµε το απόλυτο µονοπάτι στην αναφορά (absolute path) π.χ. /images/image01.gif. 20

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

<BODY></a> </h3> <p> <img alt="<HTML> <HEAD> <TITLE> <BODY>" title="<HTML> <HEAD> <TITLE> <BODY>" class="news-block-img pull-right" src="/thumbs/26/2082816.jpg"> ΑΣΚΗΣΗ 1 1. Ανοίξτε τον επεξεργαστή ιστοσελίδων 2. Αποθηκεύστε στο X:/mathimata/html/askiseis/ με όνομα askisi1b.html 3. Θα φτιάξουμε μια νέα ιστοσελίδα, χρησιμοποιώντας τις βασικές ετικέτες </p> <a href="/2082816-Html-head-title-body.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/40542359-Ypersyndeseis-hyperlinks.html">Υπερσυνδέσεις (hyperlinks)</a> </h3> <p> <img alt="Υπερσυνδέσεις (hyperlinks)" title="Υπερσυνδέσεις (hyperlinks)" class="news-block-img pull-right" src="/thumbs/57/40542359.jpg"> Υπερσυνδέσεις (hyperlinks) Οι υπερσυνδέσεις αποτελούν το δυναμικό στοιχείο σε ένα έγγραφο html. Με τις υπερσυνδέσεις είναι δυνατή, εύκολη και γρήγορη η μετάβαση ή η παραπομπή από ένα αρχείο html (πηγή) </p> <a href="/40542359-Ypersyndeseis-hyperlinks.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/3858593-Sholi-koinonikon-epistimon-tmima-politismikis-tehnologias-kai-epikoinonias.html">Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας</a> </h3> <p> <img alt="Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας" title="Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας" class="news-block-img pull-right" src="/thumbs/24/3858593.jpg"> Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας Δικτυακά Πολυμέσα Ι (Β Έτος, 3ο εξ) Διάλεξη #5η: HTML: πίνακες (tables), πλαίσια (frames) Γαβαλάς Δαμιανός </p> <a href="/3858593-Sholi-koinonikon-epistimon-tmima-politismikis-tehnologias-kai-epikoinonias.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31456968-Programmatistika-ergaleia-gia-to-diadiktyo.html">ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ</a> </h3> <p> <img alt="ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ" title="ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ" class="news-block-img pull-right" src="/thumbs/53/31456968.jpg"> ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ Κεφάλαιο 4. Η γλώσσα HTML Επιμέλεια: Καραγιάννης Σπύρος Καθηγητής ΠΕ19 Βασικοί κανόνες σύνταξης HTML ομή σελίδας HTML Μορφοποίηση κειμένου Κατάλογοι Εισαγωγή </p> <a href="/31456968-Programmatistika-ergaleia-gia-to-diadiktyo.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/10949182-Tehnologies-diadiktyoy-exaskitheite-stin-html.html">Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML)</a> </h3> <p> <img alt="Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML)" title="Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML)" class="news-block-img pull-right" src="/thumbs/27/10949182.jpg"> Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML) 1. Δημιουργία μιας απλής σελίδας HTML Ανοίξτε το Notepad ακολουθώντας τη διαδρομή Start All Programs Accessories Notepad Πληκτρολογήστε το ακόλουθο κείμενο: </p> <a href="/10949182-Tehnologies-diadiktyoy-exaskitheite-stin-html.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/37876780-Epanaliptiki-askisi-etiketes-html.html">Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML</a> </h3> <p> <img alt="Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML" title="Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML" class="news-block-img pull-right" src="/thumbs/55/37876780.jpg"> Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο για το αρχείο Ορίζει το σώµα της background URL </p> <a href="/37876780-Epanaliptiki-askisi-etiketes-html.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/2082644-Ergastirio-front-page-2.html">ΕΡΓΑΣΤΗΡΙΟ FRONT PAGE 2</a> </h3> <p> <img alt="ΕΡΓΑΣΤΗΡΙΟ FRONT PAGE 2" title="ΕΡΓΑΣΤΗΡΙΟ FRONT PAGE 2" class="news-block-img pull-right" src="/thumbs/26/2082644.jpg"> ΕΡΓΑΣΤΗΡΙΟ FRONT PAGE 2 Μάθαµε στο προηγούµενο µάθηµα πώς να δίνουµε ονόµατα στις ιστοσελίδες µας, να βάζουµε χρώµα και γραφικά, ή ακόµα να δηµιουργούµε υπερσυνδέσµους σε κείµενο και εικόνες. Σήµερα µεταξύ </p> <a href="/2082644-Ergastirio-front-page-2.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/30835861-Hyper-text-markup-language-html-poy-simainei-glossa-simansis-yperkeimenoy.html">Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου.</a> </h3> <p> <img alt="Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου." title="Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου." class="news-block-img pull-right" src="/thumbs/53/30835861.jpg"> Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου. 1 η ΑΣΚΗΣΗ Οι HTML σελίδες είναι απλές σελίδες κειμένου και μπορούν να δημιουργηθούν από οποιοδήποτε πρόγραμμα επεξεργασίας </p> <a href="/30835861-Hyper-text-markup-language-html-poy-simainei-glossa-simansis-yperkeimenoy.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/9710600-Ethniko-metsovio-polytehneio-siueioseis-gia-ti-glossa-html-hypertext-markup-language.html">ΕΘΝΙΚΟ ΜΕΤΣΟΒΙΟ ΠΟΛΥΤΕΧΝΕΙΟ. Σηµειώσεις για τη γλώσσα HTML (HyperText Markup Language)</a> </h3> <p> <img alt="ΕΘΝΙΚΟ ΜΕΤΣΟΒΙΟ ΠΟΛΥΤΕΧΝΕΙΟ. Σηµειώσεις για τη γλώσσα HTML (HyperText Markup Language)" title="ΕΘΝΙΚΟ ΜΕΤΣΟΒΙΟ ΠΟΛΥΤΕΧΝΕΙΟ. Σηµειώσεις για τη γλώσσα HTML (HyperText Markup Language)" class="news-block-img pull-right" src="/thumbs/27/9710600.jpg"> ΕΘΝΙΚΟ ΜΕΤΣΟΒΙΟ ΠΟΛΥΤΕΧΝΕΙΟ ΣΧΟΛΗ ΗΛΕΚΤΡΟΛΟΓΩΝ ΜΗΧΑΝΙΚΩΝ ΚΑΙ ΜΗΧΑΝΙΚΩΝ ΥΠΟΛΟΓΙΣΤΩΝ Σηµειώσεις για τη γλώσσα HTML (HyperText Markup Language) ιδάσκων Αν. Καθηγητής Ι.Σ.Βενιέρης Αθήνα, Ιανουάριος 2003 1 </p> <a href="/9710600-Ethniko-metsovio-polytehneio-siueioseis-gia-ti-glossa-html-hypertext-markup-language.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/33359887-Kefalaio-11-eisagogi-stin-html-efarmoges-pliroforikis-kef-11-karamaoynas-polykarpos.html">Κεφάλαιο 11: Εισαγωγή στην HTML. Εφαρμογές Πληροφορικής Κεφ. 11 Καραμαούνας Πολύκαρπος</a> </h3> <p> <img alt="Κεφάλαιο 11: Εισαγωγή στην HTML. Εφαρμογές Πληροφορικής Κεφ. 11 Καραμαούνας Πολύκαρπος" title="Κεφάλαιο 11: Εισαγωγή στην HTML. Εφαρμογές Πληροφορικής Κεφ. 11 Καραμαούνας Πολύκαρπος" class="news-block-img pull-right" src="/thumbs/54/33359887.jpg"> Κεφάλαιο 11: Εισαγωγή στην HTML 1 11.1 Γενική εισαγωγή στην HTML Τι είναι η HTML HyperText Markup Language - Γλώσσα Χαρακτηρισμού Υπερ-Κειμένου είναι η βασική γλώσσα με την οποία πραγματοποιείται η δόμηση </p> <a href="/33359887-Kefalaio-11-eisagogi-stin-html-efarmoges-pliroforikis-kef-11-karamaoynas-polykarpos.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/34692357-Ref-slws-1-5copyright-2005-the-european-computer-driving-licence-foundation-ltd-selida-1-apo-7.html">Ref.: SLWS 1 5Copyright 2005 The European Computer Driving Licence Foundation Ltd Σελίδα 1 από 7</a> </h3> <p> <img alt="Ref.: SLWS 1 5Copyright 2005 The European Computer Driving Licence Foundation Ltd Σελίδα 1 από 7" title="Ref.: SLWS 1 5Copyright 2005 The European Computer Driving Licence Foundation Ltd Σελίδα 1 από 7" class="news-block-img pull-right" src="/thumbs/54/34692357.jpg"> The European Computer Driving Licence Foundation Ltd Σελίδα 1 από 7 ΣΤΟΧΟΙ ΕΞΕΤΑΣΗΣ Η ενότητα ECDL WebStarter απαιτεί από τον Υποψήφιο να κατανοεί τις κύριες έννοιες της σχεδίασης και δημοσίευσης δικτυακών </p> <a href="/34692357-Ref-slws-1-5copyright-2005-the-european-computer-driving-licence-foundation-ltd-selida-1-apo-7.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31007132-Ergastirio-tehnologies-pliroforias-kai-epikoinonias-ston-toyrismo-2o-ergastirio-morfopoiisi-stin-html.html">ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 2o ΕΡΓΑΣΤΗΡΙΟ ΜΟΡΦΟΠΟΙΗΣΗ ΣΤΗΝ HTML</a> </h3> <p> <img alt="ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 2o ΕΡΓΑΣΤΗΡΙΟ ΜΟΡΦΟΠΟΙΗΣΗ ΣΤΗΝ HTML" title="ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 2o ΕΡΓΑΣΤΗΡΙΟ ΜΟΡΦΟΠΟΙΗΣΗ ΣΤΗΝ HTML" class="news-block-img pull-right" src="/thumbs/53/31007132.jpg"> ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ ΠΕΡΙΕΧΟΜΕΝΟ ΜΑΘΗΜΑΤΟΣ 2o ΕΡΓΑΣΤΗΡΙΟ ΜΟΡΦΟΠΟΙΗΣΗ ΣΤΗΝ HTML 1. Μορφοποίηση κειμένου Ετικέτες στυλ 2. Ιδιότητες ετικετών 3. Λίστες 4. Υπερσυνδέσεις </p> <a href="/31007132-Ergastirio-tehnologies-pliroforias-kai-epikoinonias-ston-toyrismo-2o-ergastirio-morfopoiisi-stin-html.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/2533222-I-glossa-programmatismoy-toy-internet-html.html">Η Γλώσσα Προγραμματισμού του Internet HTML</a> </h3> <p> <img alt="Η Γλώσσα Προγραμματισμού του Internet HTML" title="Η Γλώσσα Προγραμματισμού του Internet HTML" class="news-block-img pull-right" src="/thumbs/24/2533222.jpg"> Η Γλώσσα Προγραμματισμού του Internet HTML Η HTML και το Internet Κάθε σελίδα που εμφανίζεται στο Internet είναι ένα αρχείο γραμμένο με τη γλώσσα HTML (HyperText Markup Language, Γλώσσα Χαρακτηρισμού Υπερ-Κειμένου), </p> <a href="/2533222-I-glossa-programmatismoy-toy-internet-html.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/35823271-Tec410-anaptyxi-diktyakon-topon-d-examino.html">TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)</a> </h3> <p> <img alt="TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)" title="TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)" class="news-block-img pull-right" src="/thumbs/55/35823271.jpg"> TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί </p> <a href="/35823271-Tec410-anaptyxi-diktyakon-topon-d-examino.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/1860045-Html-1-eisagogi-stin-html-kai-ta-css.html">HTML... 1. Εισαγωγή στην HTML και τα CSS</a> </h3> <p> <img alt="HTML... 1. Εισαγωγή στην HTML και τα CSS" title="HTML... 1. Εισαγωγή στην HTML και τα CSS" class="news-block-img pull-right" src="/thumbs/23/1860045.jpg"> HTML...... 1 Εισαγωγή στην HTML και τα CSS HTML...... 2 HTML. H HTML (HYPERTEXT MARKUP LANGUAGE), είναι µία γλώσσα η οποία «λέει» στον υπολογιστή πως θα πρέπει να εµφανίσει µία ιστοσελίδα. Τα αρχεία στα </p> <a href="/1860045-Html-1-eisagogi-stin-html-kai-ta-css.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/30203942-Ti-einai-i-html-ti-einai-oi-etiketes-tags-pos-einai-mia-etiketa-tag.html">Τι είναι η HTML; Τί είναι οι ετικέτες (tags); Πώς είναι μια ετικέτα (tag);</a> </h3> <p> <img alt="Τι είναι η HTML; Τί είναι οι ετικέτες (tags); Πώς είναι μια ετικέτα (tag);" title="Τι είναι η HTML; Τί είναι οι ετικέτες (tags); Πώς είναι μια ετικέτα (tag);" class="news-block-img pull-right" src="/thumbs/52/30203942.jpg"> Τι είναι η HTML; Η HTML είναι το ακρώνυμο από το Hyper Text Markup Language που σημαίνει γλώσσα χαρακτηρισμού υπερκειμένου. Η χρήση μιας γλώσσας χαρακτηρισμού σημαίνει ότι γράφεται πρώτα το κείμενο και </p> <a href="/30203942-Ti-einai-i-html-ti-einai-oi-etiketes-tags-pos-einai-mia-etiketa-tag.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/36672493-Paroysiasi-kai-morfopoiisi-keimenoy.html">Παρουσίαση και μορφοποίηση κειμένου</a> </h3> <p> <img alt="Παρουσίαση και μορφοποίηση κειμένου" title="Παρουσίαση και μορφοποίηση κειμένου" class="news-block-img pull-right" src="/thumbs/55/36672493.jpg"> HTML [ετικέτες] Παρουσίαση και μορφοποίηση κειμένου Στην HTML σύμφωνα με τους κανόνες, κενές γραμμές και περισσότερα του ενός κενά μεταξύ λέξεων δεν λαμβάνονται υπόψη από τον φυλλομετρητή. Για αυτό το </p> <a href="/36672493-Paroysiasi-kai-morfopoiisi-keimenoy.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/36256359-I-lista-ol-ordered-list.html">Η λίστα <ol> (ordered list)</a> </h3> <p> <img alt="Η λίστα <ol> (ordered list)" title="Η λίστα <ol> (ordered list)" class="news-block-img pull-right" src="/thumbs/55/36256359.jpg"> Λίστες (lists) Σε πολλά έγγραφα απαιτείται η παρουσίαση ή η καταγραφή στοιχείων σε μορφή λίστας. Για παράδειγμα, μια λίστα από ονόματα ή μια λίστα από προϊόντα. Τα στοιχεία μιας λίστας μπορεί να είναι </p> <a href="/36256359-I-lista-ol-ordered-list.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/6937926-Shift-gramma-patame-ton-tono-di-la-sto-l-kai-meta-to-fonien-pos-vazoyme-dialytika-patame-to-shift-tono-kai-meta-to-fonien-i-i-y.html">Shift+γράμμα. Πατάμε τον τόνο (δί[λα στο L) και μετά το φωνήεν. Πως βάζουμε διαλυτικά; Πατάμε το Shift+ τόνο και μετά το φωνήεν (ι ή υ)</a> </h3> <p> <img alt="Shift+γράμμα. Πατάμε τον τόνο (δί[λα στο L) και μετά το φωνήεν. Πως βάζουμε διαλυτικά; Πατάμε το Shift+ τόνο και μετά το φωνήεν (ι ή υ)" title="Shift+γράμμα. Πατάμε τον τόνο (δί[λα στο L) και μετά το φωνήεν. Πως βάζουμε διαλυτικά; Πατάμε το Shift+ τόνο και μετά το φωνήεν (ι ή υ)" class="news-block-img pull-right" src="/thumbs/25/6937926.jpg"> Βασικές λειτουργίες του πληκτρολογίου Αλλαγή μεταξύ Αγγλικών και Ελληνικών Όταν γράφουμε σε πεζά (μικρά) και θέλουμε να γράψουμε ένα γράμμα κεφαλαίο Όταν γράφουμε συνέχεια Κεφαλαία Για να γράψουμε ένα </p> <a href="/6937926-Shift-gramma-patame-ton-tono-di-la-sto-l-kai-meta-to-fonien-pos-vazoyme-dialytika-patame-to-shift-tono-kai-meta-to-fonien-i-i-y.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/6937673-Pinakes-perigrauuata-kai-skiasi.html">Πίνακες, περιγράµµατα και σκίαση</a> </h3> <p> <img alt="Πίνακες, περιγράµµατα και σκίαση" title="Πίνακες, περιγράµµατα και σκίαση" class="news-block-img pull-right" src="/thumbs/25/6937673.jpg"> Πίνακες, περιγράµµατα και σκίαση Οι πίνακες Οι πίνακες είναι ορθογώνια πλαίσια που χωρίζονται σε γραµµές και στήλες. Η τοµή µιας γραµµής µε µια στήλη προσδιορίζει ένα κελί. Τα στοιχεία, που παρουσιάζουµε, </p> <a href="/6937673-Pinakes-perigrauuata-kai-skiasi.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/34148657-Stis-epouenes-diafaneies-tha-doyue-tis-idiotites-toy-css-poy-uporoyue-na-epireasoyue-ueso-toy-dreamweaver.html">Στις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver.</a> </h3> <p> <img alt="Στις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver." title="Στις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver." class="news-block-img pull-right" src="/thumbs/54/34148657.jpg"> Στις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver. 37 Αφού καθορίσετε τα βασικά στοιχεία του νέου κανόνα css, όπως είδαµε στις προηγούµενες διαφάνειες, </p> <a href="/34148657-Stis-epouenes-diafaneies-tha-doyue-tis-idiotites-toy-css-poy-uporoyue-na-epireasoyue-ueso-toy-dreamweaver.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/35545141-Dialexi-2i-eisagogi-sto-css.html">Διάλεξη 2η Εισαγωγή στο CSS</a> </h3> <p> <img alt="Διάλεξη 2η Εισαγωγή στο CSS" title="Διάλεξη 2η Εισαγωγή στο CSS" class="news-block-img pull-right" src="/thumbs/55/35545141.jpg"> Διάλεξη 2η Εισαγωγή στο CSS Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e c o d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Τι είναι το CSS? Γιατί να χρησιμοποιήσω </p> <a href="/35545141-Dialexi-2i-eisagogi-sto-css.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/9698235-Ergaleia-anaptyxis-efarmogon-internet-i.html">Εργαλεία ανάπτυξης εφαρμογών internet Ι</a> </h3> <p> <img alt="Εργαλεία ανάπτυξης εφαρμογών internet Ι" title="Εργαλεία ανάπτυξης εφαρμογών internet Ι" class="news-block-img pull-right" src="/thumbs/27/9698235.jpg"> IEK ΟΑΕΔ ΚΑΛΑΜΑΤΑΣ ΤΕΧΝΙΚΟΣ ΕΦΑΡΜΟΓΩΝ ΠΛΗΟΦΟΡΙΚΗΣ Εργαλεία ανάπτυξης εφαρμογών internet Ι HTML Διδάσκουσα: Κανελλοπούλου Χριστίνα ΠΕ19 Πληροφορικής HTML (HyperText Markup Language) Η γλώσσα που χρησιμοποιείται </p> <a href="/9698235-Ergaleia-anaptyxis-efarmogon-internet-i.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/30361572-Vasileios-kontogiannis-pe19.html">Βασίλειος Κοντογιάννης ΠΕ19</a> </h3> <p> <img alt="Βασίλειος Κοντογιάννης ΠΕ19" title="Βασίλειος Κοντογιάννης ΠΕ19" class="news-block-img pull-right" src="/thumbs/52/30361572.jpg"> Ενότητα3 Επικοινωνία και Διαδίκτυο 11.1 Γενική Εισαγωγή στην HTML Τι είναι η HTML (HyperText Markup Language); Είναι μια γλώσσα σήμανσης (Markup) με την οποία πραγματοποιείται η δόμηση σελίδων του Παγκόσμιου </p> <a href="/30361572-Vasileios-kontogiannis-pe19.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/32736279-2-eisagogi-stin-html-giorgos-giannakakis-manolis-tsiknakis.html">2. ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ</a> </h3> <p> <img alt="2. ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ" title="2. ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ" class="news-block-img pull-right" src="/thumbs/53/32736279.jpg"> 2014 2. ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ H HTML είναι μία γλώσσα σήμανσης και αποτελεί την κύρια γλώσσα δημιουργίας ιστοσελίδων του διαδικτύου. Είναι το ακρωνύμιο των λέξεων HyperText </p> <a href="/32736279-2-eisagogi-stin-html-giorgos-giannakakis-manolis-tsiknakis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/40710440-Css-1-didaskontes-p-aggelatos-d-zindros-epimeleia-diafaneion-d-zindros-sholi-ilektrologon-mihanikon-kai-mihanikon-ypologiston.html">CSS 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών</a> </h3> <p> <img alt="CSS 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών" title="CSS 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών" class="news-block-img pull-right" src="/thumbs/57/40710440.jpg"> CSS 1 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης Creative </p> <a href="/40710440-Css-1-didaskontes-p-aggelatos-d-zindros-epimeleia-diafaneion-d-zindros-sholi-ilektrologon-mihanikon-kai-mihanikon-ypologiston.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/35042104-Periehomena-gavalas-damianos.html">Περιεχόμενα. Γαβαλάς Δαμιανός</a> </h3> <p> <img alt="Περιεχόμενα. Γαβαλάς Δαμιανός" title="Περιεχόμενα. Γαβαλάς Δαμιανός" class="news-block-img pull-right" src="/thumbs/54/35042104.jpg"> Δικτυακά Πολυμέσα ΙΙ Διάλεξη #5 η : Τυπογραφία στο web Γαβαλάς Δαμιανός dgavalas@aegean.gr Περιεχόμενα Κατανόηση αρχών σχεδιασμού με γραμματοσειρές Κατανόηση των μονάδων μέτρησης που χρησιμοποιούνται στα </p> <a href="/35042104-Periehomena-gavalas-damianos.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/10494144-Stayros-kaoykakis-eytyhios-vavoyrakis.html">Σταύρος Καουκάκης Ευτύχιος Βαβουράκης</a> </h3> <p> <img alt="Σταύρος Καουκάκης Ευτύχιος Βαβουράκης" title="Σταύρος Καουκάκης Ευτύχιος Βαβουράκης" class="news-block-img pull-right" src="/thumbs/27/10494144.jpg"> ΠΑΝΕΠΙΣΤΗΜΙΟ ΚΡΗΤΗΣ 1 ο ΣΧΟΛΕΙΟ ΚΩΔΙΚΑ «Βασικά Θέματα Προγραμματισμού στην Ανάπτυξη Δυναμικών Διαδικτυακών Εφαρμογών» (Part 1) Σταύρος Καουκάκης Ευτύχιος Βαβουράκης 1 Λίγα Λόγια για το Σχολείο Μονάδες </p> <a href="/10494144-Stayros-kaoykakis-eytyhios-vavoyrakis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/32916829-3-eisagogi-sto-css-giorgos-giannakakis-manolis-tsiknakis.html">3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ</a> </h3> <p> <img alt="3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ" title="3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ" class="news-block-img pull-right" src="/thumbs/53/32916829.jpg"> 2014 3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ Εισαγωγή Το CSS (Cascading Style Sheets) είναι αρχεία με κατάληξη.css τα οποία καθορίζουν την μορφοποίηση των ιστοσελίδων. Μέσω αυτών επιτυγχάνεται </p> <a href="/32916829-3-eisagogi-sto-css-giorgos-giannakakis-manolis-tsiknakis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/34833199-Tec410-anaptyxi-diktyakon-topon-d-examino.html">TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)</a> </h3> <p> <img alt="TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)" title="TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)" class="news-block-img pull-right" src="/thumbs/54/34833199.jpg"> TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί </p> <a href="/34833199-Tec410-anaptyxi-diktyakon-topon-d-examino.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31856519-Gavalas-auianos.html">Γαβαλάς αµιανός</a> </h3> <p> <img alt="Γαβαλάς αµιανός" title="Γαβαλάς αµιανός" class="news-block-img pull-right" src="/thumbs/53/31856519.jpg"> Πανεπιστήµιο Αιγαίου Σχολή Κοινωνικών Επιστηµών Τµήµα Πολιτισµικής Τεχνολογίας Και Επικοινωνίας ικτυακά Πολυµέσα Ι (Β Έτος, 3ο εξ) Εργαστήριο #1ο: Εισαγωγή στην HTML Γαβαλάς αµιανός dgavalas@aegean.gr </p> <a href="/31856519-Gavalas-auianos.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/1360020-Ypiresia-webmail-kypes.html">ΥΠΗΡΕΣΙΑ WEBMAIL ΚΥΠΕΣ</a> </h3> <p> <img alt="ΥΠΗΡΕΣΙΑ WEBMAIL ΚΥΠΕΣ" title="ΥΠΗΡΕΣΙΑ WEBMAIL ΚΥΠΕΣ" class="news-block-img pull-right" src="/thumbs/22/1360020.jpg"> ΥΠΗΡΕΣΙΑ WEBMAIL ΚΥΠΕΣ Η υπηρεσία διαχείρισης αλληλογραφίας µέσω web (webmail) δίνει την δυνατότητα στους χρήστες να διαχειριστούν την αλληλογραφία τους απ οποιοδήποτε σηµείο βρίσκονται εφόσον υπάρχει </p> <a href="/1360020-Ypiresia-webmail-kypes.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/35000879-Kefalaio-hrisi-keiuenografoy-4-1-eisagogi-skopos-ti-tha-uatheis.html">Κεφάλαιο Χρήση κειµενογράφου. 4.1 Εισαγωγή Σκοπός Τι θα µάθεις</a> </h3> <p> <img alt="Κεφάλαιο Χρήση κειµενογράφου. 4.1 Εισαγωγή Σκοπός Τι θα µάθεις" title="Κεφάλαιο Χρήση κειµενογράφου. 4.1 Εισαγωγή Σκοπός Τι θα µάθεις" class="news-block-img pull-right" src="/thumbs/54/35000879.jpg"> Κεφάλαιο 4 4. Χρήση κειµενογράφου 4.1 Εισαγωγή Η επεξεργασία κειµένων και εγγράφων αποτελεί µια από τις πιο διαδεδοµένες χρήσεις του Ηλεκτρονικού Υπολογιστή. Το κεφάλαιο αυτό αποτελεί µια εισαγωγή στον </p> <a href="/35000879-Kefalaio-hrisi-keiuenografoy-4-1-eisagogi-skopos-ti-tha-uatheis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/30748661-Se-ayto-to-mathima-tha-asholithoyme-me-ti-veltiosi-tis-emfanisis-enos-istotopoy-alla-kai-ton-eykolo-heirismo-olon-ton-allagon-tis-opoies-epithymoyme-na.html">Σε αυτό το μάθημα θα ασχοληθούμε με τη βελτίωση της εμφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισμό όλων των αλλαγών τις οποίες επιθυμούμε να</a> </h3> <p> <img alt="Σε αυτό το μάθημα θα ασχοληθούμε με τη βελτίωση της εμφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισμό όλων των αλλαγών τις οποίες επιθυμούμε να" title="Σε αυτό το μάθημα θα ασχοληθούμε με τη βελτίωση της εμφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισμό όλων των αλλαγών τις οποίες επιθυμούμε να" class="news-block-img pull-right" src="/thumbs/52/30748661.jpg"> Σε αυτό το μάθημα θα ασχοληθούμε με τη βελτίωση της εμφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισμό όλων των αλλαγών τις οποίες επιθυμούμε να κάνουμε μέσω ενός εξωτερικού αρχείου.το αρχείο αυτό </p> <a href="/30748661-Se-ayto-to-mathima-tha-asholithoyme-me-ti-veltiosi-tis-emfanisis-enos-istotopoy-alla-kai-ton-eykolo-heirismo-olon-ton-allagon-tis-opoies-epithymoyme-na.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/23909437-Glosses-siuansis-markup-languages-tehnologia-iadiktyoy-kai-ilektroniko-euporio.html">Γλώσσες Σήµανσης (Markup Languages) Τεχνολογία ιαδικτύου και Ηλεκτρονικό Εµπόριο</a> </h3> <p> <img alt="Γλώσσες Σήµανσης (Markup Languages) Τεχνολογία ιαδικτύου και Ηλεκτρονικό Εµπόριο" title="Γλώσσες Σήµανσης (Markup Languages) Τεχνολογία ιαδικτύου και Ηλεκτρονικό Εµπόριο" class="news-block-img pull-right" src="/thumbs/48/23909437.jpg"> Γλώσσες Σήµανσης (Markup Languages) Τεχνολογία ιαδικτύου και Ηλεκτρονικό Εµπόριο 1 Γλώσσες Σήµανσης Γλώσσες σήµανσης: Αρχικά για τον καθορισµό εµφάνισης σελίδων, γραµµατοσειρών. Στη συνέχεια επεκτάθηκαν </p> <a href="/23909437-Glosses-siuansis-markup-languages-tehnologia-iadiktyoy-kai-ilektroniko-euporio.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/40710339-11-i-glossa-html-pinakes-listes-formes.html">11. Η γλώσσα HTML Πίνακες, Λίστες, Φόρμες</a> </h3> <p> <img alt="11. Η γλώσσα HTML Πίνακες, Λίστες, Φόρμες" title="11. Η γλώσσα HTML Πίνακες, Λίστες, Φόρμες" class="news-block-img pull-right" src="/thumbs/57/40710339.jpg"> 11. Η γλώσσα HTML Πίνακες, Λίστες, Φόρμες Σκοπός του Εργαστηρίου: Σκοπός της παρούσας εργαστηριακής άσκησης είναι η εμβάθυνση σε συχνά χρησιμοποιούμενες ετικέτες HTML, όπως οι πίνακες και οι λίστες, καθώς </p> <a href="/40710339-11-i-glossa-html-pinakes-listes-formes.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/3987000-Eisagogi-se-html-kai-css-panagiotis-tsarhopoylos.html">Εισαγωγή σε HTML και CSS. Παναγιώτης Τσαρχόπουλος</a> </h3> <p> <img alt="Εισαγωγή σε HTML και CSS. Παναγιώτης Τσαρχόπουλος" title="Εισαγωγή σε HTML και CSS. Παναγιώτης Τσαρχόπουλος" class="news-block-img pull-right" src="/thumbs/24/3987000.jpg"> Εισαγωγή σε HTML και CSS Παναγιώτης Τσαρχόπουλος Περιεχόμενα Εισαγωγικές έννοιες Ορολογία και σύνταξη Κείμενο σε HTML έγγραφα Σύνδεσμοι Ψηφιακές - Ευφυείς Πόλεις - Εισαγωγή σε HTML και CSS 2 Εισαγωγικές </p> <a href="/3987000-Eisagogi-se-html-kai-css-panagiotis-tsarhopoylos.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/35273768-Eisagogi-sto-microsoft-powerpoint.html">ΕΙΣΑΓΩΓΗ ΣΤΟ MICROSOFT POWERPOINT</a> </h3> <p> <img alt="ΕΙΣΑΓΩΓΗ ΣΤΟ MICROSOFT POWERPOINT" title="ΕΙΣΑΓΩΓΗ ΣΤΟ MICROSOFT POWERPOINT" class="news-block-img pull-right" src="/thumbs/54/35273768.jpg"> ΕΙΣΑΓΩΓΗ ΣΤΟ MICROSOFT POWERPOINT 1 Εισαγωγή Το PowerPoint είναι µια ισχυρή εφαρµογή για τη δηµιουργία παρουσιάσεων και µπορεί να χρησιµεύσει στη δηµιουργία διαφανειών, καθώς και συνοδευτικών σηµειώσεων </p> <a href="/35273768-Eisagogi-sto-microsoft-powerpoint.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/4505801-Epexergasia-keimenoy-keimenografos-word.html">ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ. Κειμενογράφος WORD</a> </h3> <p> <img alt="ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ. Κειμενογράφος WORD" title="ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ. Κειμενογράφος WORD" class="news-block-img pull-right" src="/thumbs/25/4505801.jpg"> ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ Κειμενογράφος WORD ΣΚΟΠΟΣ Η ανάπτυξη δεξιοτήτων επεξεργασίας κειμένου ΠΡΟΤΑΣΕΙΣ ΚΑΙ ΡΥΘΜΙΣΕΙΣ Άνω περιθώριο (top margin) : 2.49cm Κάτω περιθώριο (bottom margin) :5.99cm Αριστερό περιθώριο </p> <a href="/4505801-Epexergasia-keimenoy-keimenografos-word.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/13218913-Eisagogi-stin-pliroforiki.html">Εισαγωγή στην πληροφορική</a> </h3> <p> <img alt="Εισαγωγή στην πληροφορική" title="Εισαγωγή στην πληροφορική" class="news-block-img pull-right" src="/thumbs/29/13218913.jpg"> Τμήμα Μηχανικών Πληροφορικής & Τηλεπικοινωνιών Εισαγωγή στην πληροφορική Ενότητα 5: Εισαγωγή στην HTML (Μέρος Α) Αγγελίδης Παντελής Τμήμα Μηχανικών Πληροφορικής και Τηλεπικοινωνιών Άδειες Χρήσης Το παρόν </p> <a href="/13218913-Eisagogi-stin-pliroforiki.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/7880585-Epl-012-eisagogi-sto-pagkosmio-plegma-pliroforion.html">ΕΠΛ 012 Εισαγωγή στο Παγκόσμιο Πλέγμα Πληροφοριών</a> </h3> <p> <img alt="ΕΠΛ 012 Εισαγωγή στο Παγκόσμιο Πλέγμα Πληροφοριών" title="ΕΠΛ 012 Εισαγωγή στο Παγκόσμιο Πλέγμα Πληροφοριών" class="news-block-img pull-right" src="/thumbs/26/7880585.jpg"> ΕΠΛ 012 Εισαγωγή στο Παγκόσμιο Πλέγμα Πληροφοριών World Wide Web (WWW) Θέματα Επεξεργασία δεδομένων στο Web Δημιουργία απλών σελίδων HTML Περιγραφή κάποιων XHTML στοιχείων (tags) Εξέλιξης του WWW Το WWW </p> <a href="/7880585-Epl-012-eisagogi-sto-pagkosmio-plegma-pliroforion.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31303669-Epexergastis-keimenoy-microsoft-word.html">Επεξεργαστής Κειμένου: (Microsoft Word)</a> </h3> <p> <img alt="Επεξεργαστής Κειμένου: (Microsoft Word)" title="Επεξεργαστής Κειμένου: (Microsoft Word)" class="news-block-img pull-right" src="/thumbs/53/31303669.jpg"> Επεξεργαστής Κειμένου: (Microsoft Word) Στο περιβάλλον εργασίας του επεξεργαστή κειμένου Microsoft Word εκτελούμε τις παρακάτω λειτουργίες: 1) Δημιουργία Νέου Εγγράφου: Η Δημιουργία ενός Νέου Εγγράφου </p> <a href="/31303669-Epexergastis-keimenoy-microsoft-word.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/12564208-Tei-kavalas-ptyhiaki-ergasia-eisagogi-miltiadis-kaklamanis.html">ΤΕΙ ΚΑΒΑΛΑΣ. Πτυχιακή εργασία ΕΙΣΑΓΩΓΗ. Μιλτιάδης Κακλαμάνης</a> </h3> <p> <img alt="ΤΕΙ ΚΑΒΑΛΑΣ. Πτυχιακή εργασία ΕΙΣΑΓΩΓΗ. Μιλτιάδης Κακλαμάνης" title="ΤΕΙ ΚΑΒΑΛΑΣ. Πτυχιακή εργασία ΕΙΣΑΓΩΓΗ. Μιλτιάδης Κακλαμάνης" class="news-block-img pull-right" src="/thumbs/28/12564208.jpg"> Σελίδα 1από ΤΕΙ ΚΑΒΑΛΑΣ Πτυχιακή εργασία Δικτυακή Εφαρμογή διαχείρισης ηλεκτρονικών εγγράφων υπηρεσίας. ΕΙΣΑΓΩΓΗ Μιλτιάδης Κακλαμάνης Σελίδα 2από Κατάλογος περιεχομένων ΕΙΣΑΓΩΓΗ...1 Σχετιζόμενα πρόσωπα...3 </p> <a href="/12564208-Tei-kavalas-ptyhiaki-ergasia-eisagogi-miltiadis-kaklamanis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/35042169-Ergastiriaki-askisi-4-morfopoiisi-keimenoy-meso-toy.html">Εργαστηριακή Άσκηση 4 Μορφοποίηση Κειμένου μέσω του</a> </h3> <p> <img alt="Εργαστηριακή Άσκηση 4 Μορφοποίηση Κειμένου μέσω του" title="Εργαστηριακή Άσκηση 4 Μορφοποίηση Κειμένου μέσω του" class="news-block-img pull-right" src="/thumbs/54/35042169.jpg"> Μορφοποίηση χαρακτήρων Όταν ανοίγουμε το Word η γραμματοσειρά που υπάρχει είναι προκαθορισμένη. Το πλαίσιο διαλόγου Γραμματοσειρά μας επιτρέπει να κάνουμε περισσότερες μορφοποιήσεις. Επιλέγουμε Μορφή Απόσταση </p> <a href="/35042169-Ergastiriaki-askisi-4-morfopoiisi-keimenoy-meso-toy.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/10944453-Eisagogi-stin-html-ta-tags-tis-html-kai-ta-gnorismata-toys.html">Εισαγωγή στην HTML Τα tags της HTML και τα γνωρίσματά τους</a> </h3> <p> <img alt="Εισαγωγή στην HTML Τα tags της HTML και τα γνωρίσματά τους" title="Εισαγωγή στην HTML Τα tags της HTML και τα γνωρίσματά τους" class="news-block-img pull-right" src="/thumbs/27/10944453.jpg"> Εισαγωγή στην HTML Τα tags της HTML και τα γνωρίσματά τους Με την γλώσσα περιγραφής υπερ-κειμένου (HTML) μπορούμε να σχεδιάζουμε ιστοσελίδες. Η HyperText Markup Language βασίζεται στην SGML (Standard Generalized </p> <a href="/10944453-Eisagogi-stin-html-ta-tags-tis-html-kai-ta-gnorismata-toys.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/42160821-Glossa-perigrafis-odigion-eufanisis-stoiheiothetisis.html">Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης</a> </h3> <p> <img alt="Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης" title="Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης" class="news-block-img pull-right" src="/thumbs/58/42160821.jpg"> CASCADING STYLE-SHEETS CASCADING STYLE-SHEETS Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης εφαρµογών HTML. Τα CSS ορίζονται σε δύο συστάσεις του W3C: CSS1, εκ. 1996 περιλαµβάνει περίπου 50 ιδιότητες </p> <a href="/42160821-Glossa-perigrafis-odigion-eufanisis-stoiheiothetisis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/1849305-Ploigisi-www-me-ton-internet-explorer.html">Πλοήγηση www / Με τον Internet Explorer</a> </h3> <p> <img alt="Πλοήγηση www / Με τον Internet Explorer" title="Πλοήγηση www / Με τον Internet Explorer" class="news-block-img pull-right" src="/thumbs/23/1849305.jpg"> Πλοήγηση www / Με τον Internet Explorer Περιεχόμενα 1.Eισαγωγή 2.Το περιβάλλον του Internet Explorer 3.Οδηγίες πλοήγησης 4.Αποθήκευση αρχείων 5.Αγαπημένα 6.Ασφαλής σύνδεση 7.Διακομιστής μεσολάβησης 1.Εισαγωγή </p> <a href="/1849305-Ploigisi-www-me-ton-internet-explorer.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/2455951-Blog-sto-wordpress-epimeleia-deggleri-sofia.html">Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία</a> </h3> <p> <img alt="Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία" title="Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία" class="news-block-img pull-right" src="/thumbs/24/2455951.jpg"> Blog στο Wordpress Επιμέλεια: Δέγγλερη Σοφία Περιεχόμενα Μετάβαση στο blog Σύνδεση ως διαχειριστής Πίνακας ελέγχου Εμφάνιση Ρυθμίσεις Άρθρα Σελίδες Πολυμέσα Σύνδεσμοι Widgets Μετάβαση στο blog Πληκτρολογούμε </p> <a href="/2455951-Blog-sto-wordpress-epimeleia-deggleri-sofia.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/33593406-Shedon-oles-oi-istoselides-vasizontai-se-megalo-vathmo-se-pinakes-gia-na-eisagoyme-enan-pinaka-epilegoyme-apo-to-menoy-insert-table.html">Σχεδόν όλες οι ιστοσελίδες βασίζονται σε μεγάλο βαθμό σε πίνακες. Για να εισάγουμε έναν πίνακα επιλέγουμε από το μενού Insert->Table.</a> </h3> <p> <img alt="Σχεδόν όλες οι ιστοσελίδες βασίζονται σε μεγάλο βαθμό σε πίνακες. Για να εισάγουμε έναν πίνακα επιλέγουμε από το μενού Insert->Table." title="Σχεδόν όλες οι ιστοσελίδες βασίζονται σε μεγάλο βαθμό σε πίνακες. Για να εισάγουμε έναν πίνακα επιλέγουμε από το μενού Insert->Table." class="news-block-img pull-right" src="/thumbs/54/33593406.jpg"> DreamWeaver - Άσκηση 4η Πίνακες Παρακάτω θα δούμε πως μπορούμε να δημιουργούμε και να επεξεργαζόμαστε πίνακες, μια πολύ βασική δομή. Θα δούμε πως γίνεται εισαγωγή πίνακα, ένωση κελιών του πίνακα, προσθήκη </p> <a href="/33593406-Shedon-oles-oi-istoselides-vasizontai-se-megalo-vathmo-se-pinakes-gia-na-eisagoyme-enan-pinaka-epilegoyme-apo-to-menoy-insert-table.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/2572359-K-a-el-e-simeioseis-epano-ston-epexergasti-keimenoy-microsoft-word-eisigitis-haritonidis-georgios-volos-noemvrios-2008.html">Κ.Α.ΕΛ.Ε. Σημειώσεις επάνω στοn επεξεργαστή κειμένου Microsoft Word. Εισηγητής: Χαριτωνίδης Γεώργιος. Βόλος, Νοέμβριος 2008</a> </h3> <p> <img alt="Κ.Α.ΕΛ.Ε. Σημειώσεις επάνω στοn επεξεργαστή κειμένου Microsoft Word. Εισηγητής: Χαριτωνίδης Γεώργιος. Βόλος, Νοέμβριος 2008" title="Κ.Α.ΕΛ.Ε. Σημειώσεις επάνω στοn επεξεργαστή κειμένου Microsoft Word. Εισηγητής: Χαριτωνίδης Γεώργιος. Βόλος, Νοέμβριος 2008" class="news-block-img pull-right" src="/thumbs/24/2572359.jpg"> Κ.Α.ΕΛ.Ε. Σημειώσεις επάνω στοn επεξεργαστή κειμένου Microsoft Word Βόλος, Νοέμβριος 2008 To Microsoft Word (έκδοση 2003) είναι ένας εξελιγμένος επεξεργαστής κειμένου, με τον οποίο μπορούμε να δημιουργήσουμε </p> <a href="/2572359-K-a-el-e-simeioseis-epano-ston-epexergasti-keimenoy-microsoft-word-eisigitis-haritonidis-georgios-volos-noemvrios-2008.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/32577238-Odigies-sto-simerino-ergastirio-tha-arhisete-na-hrisimopoieite-vasikes-odigies-morfopoiisis-tis-istoselidas-sas-kati-poy-ehoyme-apofygei-eos-tora.html">Οδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!).</a> </h3> <p> <img alt="Οδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!)." title="Οδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!)." class="news-block-img pull-right" src="/thumbs/53/32577238.jpg"> Εργαστήριο #8 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε </p> <a href="/32577238-Odigies-sto-simerino-ergastirio-tha-arhisete-na-hrisimopoieite-vasikes-odigies-morfopoiisis-tis-istoselidas-sas-kati-poy-ehoyme-apofygei-eos-tora.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/9345353-Exetastea-uli-syllabus-ekdosi-1-5.html">Εξεταστέα Ύλη (Syllabus) Έκδοση 1.5</a> </h3> <p> <img alt="Εξεταστέα Ύλη (Syllabus) Έκδοση 1.5" title="Εξεταστέα Ύλη (Syllabus) Έκδοση 1.5" class="news-block-img pull-right" src="/thumbs/26/9345353.jpg"> Εξεταστέα Ύλη (Syllabus) Έκδοση 1.5 Πνευματικά Δικαιώματα 2005 Ίδρυμα ECDL (ECDL Foundation www.ecdl.com) Όλα τα δικαιώματα είναι κατοχυρωμένα. Κανένα μέρος αυτού του εγγράφου δεν μπορεί να αναπαραχθεί </p> <a href="/9345353-Exetastea-uli-syllabus-ekdosi-1-5.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/4006259-.html"></a> </h3> <p> <img alt="" title="" class="news-block-img pull-right" src="/thumbs/24/4006259.jpg"> ΣΧΕ ΙΑΣΜΟΣ ΕΠΙΦΑΝΕΙΑΣ Με το σχεδιασµό επιφάνειας (Custom επιφάνεια) µπορούµε να σχεδιάσουµε επιφάνειες και αντικείµενα που δεν υπάρχουν στους καταλόγους του 1992. Τι µπορούµε να κάνουµε µε το σχεδιασµό </p> <a href="/4006259-.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/30447964-Dimioyrgia-enos-kenoy-pinaka.html">Δημιουργία ενός κενού πίνακα</a> </h3> <p> <img alt="Δημιουργία ενός κενού πίνακα" title="Δημιουργία ενός κενού πίνακα" class="news-block-img pull-right" src="/thumbs/52/30447964.jpg"> 3.4.1.1 Δημιουργία ενός κενού πίνακα Ένας πίνακας αποτελείται από έναν αριθμό γραμμών και στηλών που δημιουργούν ένα πλέγμα. Σε αυτό το πλέγμα είναι πιθανή η ύπαρξη ή μη περιθωρίων. Κάθε κελί του πίνακα </p> <a href="/30447964-Dimioyrgia-enos-kenoy-pinaka.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31039693-Greeklug-eleythero-logismiko-logismiko-anoiktoy-kodika.html">GreekLUG Ελεύθερο Λογισμικό & Λογισμικό Ανοικτού Κώδικα</a> </h3> <p> <img alt="GreekLUG Ελεύθερο Λογισμικό & Λογισμικό Ανοικτού Κώδικα" title="GreekLUG Ελεύθερο Λογισμικό & Λογισμικό Ανοικτού Κώδικα" class="news-block-img pull-right" src="/thumbs/53/31039693.jpg"> GreekLUG Ελεύθερο Λογισμικό & Λογισμικό Ανοικτού Κώδικα Μάθημα 6ο Σουίτα Γραφείου LibreOffice 2 Ύλη Μαθημάτων V Μαθ. 5/6 : Σουίτα Γραφείου LibreOffice LibreOffice Γενικά, Κειμενογράφος - LibreOffice Writer, </p> <a href="/31039693-Greeklug-eleythero-logismiko-logismiko-anoiktoy-kodika.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/7112705-Gavalas-damianos-dgavalas-aegean-gr-diktyaka-polymesa-ii-ergastirio-3-0-eisagogi-stacascading-style-sheets-css.html">Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS)</a> </h3> <p> <img alt="Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS)" title="Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS)" class="news-block-img pull-right" src="/thumbs/26/7112705.jpg"> Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS) Γαβαλάς Δαμιανός dgavalas@aegean.gr Επικαλυπτόμενα Φύλλα Στυλ (Cascading Style Sheets, CSS) Η (X)HTML προσδιορίζει τη βασική </p> <a href="/7112705-Gavalas-damianos-dgavalas-aegean-gr-diktyaka-polymesa-ii-ergastirio-3-0-eisagogi-stacascading-style-sheets-css.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/40710394-Ergastirio-tehnologies-pliroforias-kai-epikoinonias-ston-toyrismo-4o-ergastirio-eikones-stin-html.html">ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 4o ΕΡΓΑΣΤΗΡΙΟ ΕΙΚΟΝΕΣ ΣΤΗΝ HTML</a> </h3> <p> <img alt="ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 4o ΕΡΓΑΣΤΗΡΙΟ ΕΙΚΟΝΕΣ ΣΤΗΝ HTML" title="ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 4o ΕΡΓΑΣΤΗΡΙΟ ΕΙΚΟΝΕΣ ΣΤΗΝ HTML" class="news-block-img pull-right" src="/thumbs/57/40710394.jpg"> ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ ΠΕΡΙΕΧΟΜΕΝΟ ΜΑΘΗΜΑΤΟΣ 1. Εικόνες 2. Ασκήσεις 4o ΕΡΓΑΣΤΗΡΙΟ ΕΙΚΟΝΕΣ ΣΤΗΝ HTML 1. Εικόνες 1. Οι μορφές (format) των εικόνων που μπορείτε </p> <a href="/40710394-Ergastirio-tehnologies-pliroforias-kai-epikoinonias-ston-toyrismo-4o-ergastirio-eikones-stin-html.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31806541-Eisagogi-stin-html-1.html">Εισαγωγή στην HTML (1)</a> </h3> <p> <img alt="Εισαγωγή στην HTML (1)" title="Εισαγωγή στην HTML (1)" class="news-block-img pull-right" src="/thumbs/53/31806541.jpg"> Εισαγωγή στην HTML (1) Πανεπιστήμιο Πελοποννήσου Τμήμα Επιστήμης & Τεχνολογίας Τηλεπικοινωνιών Ευάγγελος Α. Κοσμάτος HTML HyperText Mark-up Language Καθορίζει τον τρόπο που ο browser εμφανίζει τα διάφορα </p> <a href="/31806541-Eisagogi-stin-html-1.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/33507130-Tec410-anaptyxi-diktyakon-topon-d-examino.html">TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)</a> </h3> <p> <img alt="TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)" title="TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)" class="news-block-img pull-right" src="/thumbs/54/33507130.jpg"> TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί </p> <a href="/33507130-Tec410-anaptyxi-diktyakon-topon-d-examino.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/34670596-Tec410-anaptyxi-diktyakon-topon-d-examino.html">TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)</a> </h3> <p> <img alt="TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)" title="TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)" class="news-block-img pull-right" src="/thumbs/54/34670596.jpg"> TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί </p> <a href="/34670596-Tec410-anaptyxi-diktyakon-topon-d-examino.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31845264-Blog-sto-wordpress-epimeleia-deggleri-sofia.html">Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία</a> </h3> <p> <img alt="Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία" title="Blog στο Wordpress. Επιμέλεια: Δέγγλερη Σοφία" class="news-block-img pull-right" src="/thumbs/53/31845264.jpg"> Blog στο Wordpress Επιμέλεια: Δέγγλερη Σοφία Περιεχόμενα Μετάβαση στο blog Σύνδεση ως διαχειριστής Πίνακας ελέγχου Εμφάνιση Ρυθμίσεις Άρθρα Σελίδες Πολυμέσα Σύνδεσμοι Μετάβαση στο blog Πληκτρολογούμε στη </p> <a href="/31845264-Blog-sto-wordpress-epimeleia-deggleri-sofia.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/37709260-Periehomena-gavalas-damianos-trehon-status-tis-html.html">Περιεχόμενα. Γαβαλάς Δαμιανός Τρέχον status της HTML</a> </h3> <p> <img alt="Περιεχόμενα. Γαβαλάς Δαμιανός Τρέχον status της HTML" title="Περιεχόμενα. Γαβαλάς Δαμιανός Τρέχον status της HTML" class="news-block-img pull-right" src="/thumbs/55/37709260.jpg"> Δικτυακά Πολυμέσα ΙΙ Διάλεξη #2 η : Βασικές έννοιες σχεδιασμού στο web Γαβαλάς Δαμιανός dgavalas@aegean.gr Περιεχόμενα Τρέχον status της HTML Μετάβαση από την HTML στην XHTML Κλέ Καλές πρακτικές συγγραφής </p> <a href="/37709260-Periehomena-gavalas-damianos-trehon-status-tis-html.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/8726393-2-o-e-k-f-e-irakleioy-odigies-hrisis-pdfcreator.html">2 Ο Ε.Κ.Φ.Ε. ΗΡΑΚΛΕΙΟΥ. Οδηγίες χρήσης PDFCreator</a> </h3> <p> <img alt="2 Ο Ε.Κ.Φ.Ε. ΗΡΑΚΛΕΙΟΥ. Οδηγίες χρήσης PDFCreator" title="2 Ο Ε.Κ.Φ.Ε. ΗΡΑΚΛΕΙΟΥ. Οδηγίες χρήσης PDFCreator" class="news-block-img pull-right" src="/thumbs/26/8726393.jpg"> 2 Ο Ε.Κ.Φ.Ε. ΗΡΑΚΛΕΙΟΥ Οδηγίες χρήσης PDFCreator Ηράκλειο 2008 Π Ε Ρ Ι Ε Χ Ο Μ Ε Ν Α Σηµείωµα του συντάκτη... 2 Στοιχεία δηµιουργού του υλικού... 3 Εισαγωγή... 3 Τι είναι... 4 Που θα το βρείτε... 4 Τρόπος </p> <a href="/8726393-2-o-e-k-f-e-irakleioy-odigies-hrisis-pdfcreator.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/35041984-I-vivlos-ton-css-eisagogi-sta-css.html">Η Βίβλος των CSS. Εισαγωγή στα CSS</a> </h3> <p> <img alt="Η Βίβλος των CSS. Εισαγωγή στα CSS" title="Η Βίβλος των CSS. Εισαγωγή στα CSS" class="news-block-img pull-right" src="/thumbs/54/35041984.jpg"> Η Βίβλος των CSS Εισαγωγή στα CSS Τα Διαδοχικά Φύλλα Στυλ (CSS, Cascading Style Sheets) αποτελούν ένα πολύ καλό εργαλείο για να μπορούμε να αλλάζουμε την εμφάνιση και τη διάταξη (layout) των ιστοσελίδων </p> <a href="/35041984-I-vivlos-ton-css-eisagogi-sta-css.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/37236240-Allagi-tis-emfanisis-keimenoy-megethos-grammatoseiras-eidos-grammatoseiras.html">Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς</a> </h3> <p> <img alt="Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς" title="Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς" class="news-block-img pull-right" src="/thumbs/55/37236240.jpg"> 3.3.1.1 Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς Γραμματοσειρές Η λέξη γραμματοσειρά αναφέρεται στο στυλ που εμφανίζονται τα γράμματα. Παρακάτω ακολουθούν κάποια παραδείγματα, </p> <a href="/37236240-Allagi-tis-emfanisis-keimenoy-megethos-grammatoseiras-eidos-grammatoseiras.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/10416197-Odigies-keimenografoy-2007.html">ΟΔΗΓΙΕΣ ΚΕΙΜΕΝΟΓΡΑΦΟΥ 2007</a> </h3> <p> <img alt="ΟΔΗΓΙΕΣ ΚΕΙΜΕΝΟΓΡΑΦΟΥ 2007" title="ΟΔΗΓΙΕΣ ΚΕΙΜΕΝΟΓΡΑΦΟΥ 2007" class="news-block-img pull-right" src="/thumbs/27/10416197.jpg"> 1. ΓΡΑΜΜΗ ΜΕΝΟΥ ΟΔΗΓΙΕΣ ΚΕΙΜΕΝΟΓΡΑΦΟΥ 2007 2. ΓΡΑΜΜΗ ΕΡΓΑΛΕΙΩΝ Κάθε μενού έχει τις δικές της δυνατότητες, όπως για παράδειγμα μόλις πατήσετε το κουμπί κεντρική βγαίνουν τα εικονίδια των δυνατοτήτων που </p> <a href="/10416197-Odigies-keimenografoy-2007.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/842866-Imioyrgia-istoseli-as-sto-microsoft-word.html">ΗΜΙΟΥΡΓΙΑ ΙΣΤΟΣΕΛΙ ΑΣ ΣΤΟ MICROSOFT WORD</a> </h3> <p> <img alt="ΗΜΙΟΥΡΓΙΑ ΙΣΤΟΣΕΛΙ ΑΣ ΣΤΟ MICROSOFT WORD" title="ΗΜΙΟΥΡΓΙΑ ΙΣΤΟΣΕΛΙ ΑΣ ΣΤΟ MICROSOFT WORD" class="news-block-img pull-right" src="/thumbs/18/842866.jpg"> ΗΜΙΟΥΡΓΙΑ ΙΣΤΟΣΕΛΙ ΑΣ ΣΤΟ MICROSOFT WORD Σε ορισµένες περιπτώσεις είναι ιδιαίτερα χρήσιµη η δηµιουργία ιστοσελίδων ενηµερωτικού περιεχοµένου οι οποίες στη συνέχεια µπορούν να δηµοσιευθούν σε κάποιο τόπο </p> <a href="/842866-Imioyrgia-istoseli-as-sto-microsoft-word.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/29541196-Mathima-stoihisi-paragrafon-2-esohes-paragrafon-stohoi.html">ΜΑΘΗΜΑ Στοίχιση Παραγράφων. 2. Εσοχές Παραγράφων ΣΤΟΧΟΙ:</a> </h3> <p> <img alt="ΜΑΘΗΜΑ Στοίχιση Παραγράφων. 2. Εσοχές Παραγράφων ΣΤΟΧΟΙ:" title="ΜΑΘΗΜΑ Στοίχιση Παραγράφων. 2. Εσοχές Παραγράφων ΣΤΟΧΟΙ:" class="news-block-img pull-right" src="/thumbs/52/29541196.jpg"> ΜΑΘΗΜΑ 4 ΣΤΟΧΟΙ: 1. Στοίχιση Παραγράφων 2. Εσοχές Παραγράφων 3. Διάστημα Μεταξύ Γραμμών (Διάστιχο) 4. Απόσταση Μεταξύ Παραγράφων 5. Καθορισμός Στηλοθετών (Tabs) 6. Μετακίνηση Στηλοθετών 7. Διαγραφή Στηλοθετών </p> <a href="/29541196-Mathima-stoihisi-paragrafon-2-esohes-paragrafon-stohoi.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/1361536-Spoydes-cad-pliroforikis-oikonomias-dioikisis-kai-d-t-p-me-systima-didaskalias-facetoface.html">Σπουδές CAD, Πληροφορικής, Οικονομίας, Διοίκησης και D.T.P. με Σύστημα διδασκαλίας facetoface</a> </h3> <p> <img alt="Σπουδές CAD, Πληροφορικής, Οικονομίας, Διοίκησης και D.T.P. με Σύστημα διδασκαλίας facetoface" title="Σπουδές CAD, Πληροφορικής, Οικονομίας, Διοίκησης και D.T.P. με Σύστημα διδασκαλίας facetoface" class="news-block-img pull-right" src="/thumbs/22/1361536.jpg"> Copyright 2009-2012 -SYSTEM- All rights reserved 2/159 ΠΕΡΙΕΧΟΜΕΝΑ Μάθημα 1: New - Save Μάθημα 2: Εισαγωγή στη CSS Μάθημα 3: Τρόπος Σύνταξης Μάθημα 4: Σχόλια Μάθημα 5: ID Μάθημα 6: Class Μάθημα 7: Background </p> <a href="/1361536-Spoydes-cad-pliroforikis-oikonomias-dioikisis-kai-d-t-p-me-systima-didaskalias-facetoface.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31016859-Periehomena-perigrafi-tis-arhikis-othonis-kathe-taxis-a-eikonidia-epilogis-theuatikon-enotiton-v-eikonidia-diafygis.html">ΠΕΡΙΕΧΟΜΕΝΑ. Περιγραφή της αρχικής οθόνης κάθε τάξης α. Εικονίδια επιλογής θεµατικών ενοτήτων β. Εικονίδια διαφυγής...</a> </h3> <p> <img alt="ΠΕΡΙΕΧΟΜΕΝΑ. Περιγραφή της αρχικής οθόνης κάθε τάξης α. Εικονίδια επιλογής θεµατικών ενοτήτων β. Εικονίδια διαφυγής..." title="ΠΕΡΙΕΧΟΜΕΝΑ. Περιγραφή της αρχικής οθόνης κάθε τάξης α. Εικονίδια επιλογής θεµατικών ενοτήτων β. Εικονίδια διαφυγής..." class="news-block-img pull-right" src="/thumbs/53/31016859.jpg"> ΠΕΡΙΕΧΟΜΕΝΑ Α. ΕΚΚΙΝΗΣΗ ΚΛΕΙΣΙΜΟ ΤΗΣ ΕΦΑΡΜΟΓΗΣ.............................. 5 Β. ΒΑΣΙΚΕΣ ΛΕΙΤΟΥΡΓΙΕΣ ΠΡΟΣΒΑΣΙΜΟΤΗΤΑΣ.............................. 6 Γ. ΕΙΣΑΓΩΓΗ ΣΤΗΝ ΥΛΗ ΚΑΘΕ ΤΑΞΗΣ.................................... </p> <a href="/31016859-Periehomena-perigrafi-tis-arhikis-othonis-kathe-taxis-a-eikonidia-epilogis-theuatikon-enotiton-v-eikonidia-diafygis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31299076-Ecdl-module-3-epexergasia-keiuenoy-exetastea-uli-ekdosi-5-0-syllabus-version-5-0.html">ECDL Module 3 Επεξεργασία Κειµένου Εξεταστέα Ύλη, έκδοση 5.0 (Syllabus Version 5.0)</a> </h3> <p> <img alt="ECDL Module 3 Επεξεργασία Κειµένου Εξεταστέα Ύλη, έκδοση 5.0 (Syllabus Version 5.0)" title="ECDL Module 3 Επεξεργασία Κειµένου Εξεταστέα Ύλη, έκδοση 5.0 (Syllabus Version 5.0)" class="news-block-img pull-right" src="/thumbs/53/31299076.jpg"> ECDL Module 3 Επεξεργασία Κειµένου Εξεταστέα Ύλη, έκδοση 5.0 (Syllabus Version 5.0) (Module 3 Word Processing) Συνολική ιάρκεια: Προτεινόµενο * Χρονοδιάγραµµα Εκπαίδευσης 14-20 (δεκατέσσερις έως είκοσι) </p> <a href="/31299076-Ecdl-module-3-epexergasia-keiuenoy-exetastea-uli-ekdosi-5-0-syllabus-version-5-0.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/37343923-Gnoriuia-ue-ti-microsoft-access.html">Γνωριµία µε τη Microsoft Access</a> </h3> <p> <img alt="Γνωριµία µε τη Microsoft Access" title="Γνωριµία µε τη Microsoft Access" class="news-block-img pull-right" src="/thumbs/55/37343923.jpg"> Γνωριµία µε τη Microsoft Access ηµιουργία νέας βάσης δεδοµένων Έναρξη - Προγράµµατα - Microsoft Access - ηµιουργία νέας βάσης δεδοµένων µε χρήση Κενής βάσης δεδοµένων - ΟΚ Επιλέγουµε Φάκελο και στο Όνοµα </p> <a href="/37343923-Gnoriuia-ue-ti-microsoft-access.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/6093157-Stin-tehnologia-ton-css-oi-kanones-styl-style.html">Στην τεχνολογία των CSS, οι κανόνες στυλ (style</a> </h3> <p> <img alt="Στην τεχνολογία των CSS, οι κανόνες στυλ (style" title="Στην τεχνολογία των CSS, οι κανόνες στυλ (style" class="news-block-img pull-right" src="/thumbs/25/6093157.jpg"> Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #4 0 : CSS: Βασικές και προχωρημένες τεχνικές επιλογής, τα στοιχεία και , ψευδο κλάσεις και ψευδο επιλογείς Γαβαλάς Δαμιανός dgavalas@aegean.gr CSS κανόνες στυλ </p> <a href="/6093157-Stin-tehnologia-ton-css-oi-kanones-styl-style.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/10603073-Zografizontas-ue-ton-ypologisti.html">ζωγραφίζοντας µε τον υπολογιστή</a> </h3> <p> <img alt="ζωγραφίζοντας µε τον υπολογιστή" title="ζωγραφίζοντας µε τον υπολογιστή" class="news-block-img pull-right" src="/thumbs/27/10603073.jpg"> ζωγραφίζοντας µε τον υπολογιστή Μια από τις εργασίες που µπορούµε να κάνουµε µε τον υπολογιστή είναι και η ζωγραφική. Για να γίνει όµως αυτό πρέπει ο υπολογιστής να είναι εφοδιασµένος µε το κατάλληλο πρόγραµµα. </p> <a href="/10603073-Zografizontas-ue-ton-ypologisti.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/36672650-Stayros-kaoykakis-eytyhios-vavoyrakis.html">Σταύρος Καουκάκης Ευτύχιος Βαβουράκης</a> </h3> <p> <img alt="Σταύρος Καουκάκης Ευτύχιος Βαβουράκης" title="Σταύρος Καουκάκης Ευτύχιος Βαβουράκης" class="news-block-img pull-right" src="/thumbs/55/36672650.jpg"> ΠΑΝΕΠΙΣΤΗΜΙΟ ΚΡΗΤΗΣ 1 ο ΣΧΟΛΕΙΟ ΚΩΔΙΚΑ «Βασικά Θέματα Προγραμματισμού στην Ανάπτυξη Δυναμικών Διαδικτυακών Εφαρμογών» (Part 1) Σταύρος Καουκάκης Ευτύχιος Βαβουράκης 1 Λίγα Λόγια για το Σχολείο Μονάδες </p> <a href="/36672650-Stayros-kaoykakis-eytyhios-vavoyrakis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31457092-Dreamweaver-mx-7-me-poion-tropo-morfopoioyme-kapoioys-haraktires-tis-selidas-mas-sto-parathyro-properties-yparhei-i-pio-kato-grammi-ergaleion.html">DREAMWEAVER MX. 7. Με ποιον τρόπο μορφοποιούμε κάποιους χαρακτήρες της σελίδας μας; Στο παράθυρο Properties υπάρχει η πιο κάτω γραμμή εργαλείων:</a> </h3> <p> <img alt="DREAMWEAVER MX. 7. Με ποιον τρόπο μορφοποιούμε κάποιους χαρακτήρες της σελίδας μας; Στο παράθυρο Properties υπάρχει η πιο κάτω γραμμή εργαλείων:" title="DREAMWEAVER MX. 7. Με ποιον τρόπο μορφοποιούμε κάποιους χαρακτήρες της σελίδας μας; Στο παράθυρο Properties υπάρχει η πιο κάτω γραμμή εργαλείων:" class="news-block-img pull-right" src="/thumbs/53/31457092.jpg"> 1 Πώς δημιουργούμε ένα νέο Site; Πατάμε Site/ Manage Sites και μετά στο παράθυρο που εμφανίζεται πατάμε το κουμπάκι New και επιλέγουμε Site Στη συνέχεια θα πρέπει να δώσουμε: Α το όνομα που θέλουμε να </p> <a href="/31457092-Dreamweaver-mx-7-me-poion-tropo-morfopoioyme-kapoioys-haraktires-tis-selidas-mas-sto-parathyro-properties-yparhei-i-pio-kato-grammi-ergaleion.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/30596663-O-odigos-grigoris-ekkinisis.html">Ο Οδηγός γρήγορης εκκίνησης</a> </h3> <p> <img alt="Ο Οδηγός γρήγορης εκκίνησης" title="Ο Οδηγός γρήγορης εκκίνησης" class="news-block-img pull-right" src="/thumbs/52/30596663.jpg"> Ο Οδηγός γρήγορης εκκίνησης του Microsoft PowerPoint 2013 έχει διαφορετική εμφάνιση από προηγούμενες εκδόσεις. Γι αυτό το λόγο, δημιουργήσαμε αυτόν τον οδηγό για να ελαχιστοποιήσουμε την καμπύλη εκμάθησης. </p> <a href="/30596663-O-odigos-grigoris-ekkinisis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/653030-Odoraua-mobile-apothiki.html">Οδοραµα mobile ΑΠΟΘΗΚΗ</a> </h3> <p> <img alt="Οδοραµα mobile ΑΠΟΘΗΚΗ" title="Οδοραµα mobile ΑΠΟΘΗΚΗ" class="news-block-img pull-right" src="/thumbs/20/653030.jpg"> Οδοραµα mobile ΑΠΟΘΗΚΗ Όπως βλέπετε, η αρχική οθόνη της εφαρµογής διαθέτει 9 κουµπιά τα οποία σας επιτρέπουν να πλοηγηθείτε σε αυτό. Αρχίζοντας από πάνω αριστερά βλέπετε τα εξής: 1. Τιµολόγηση: Προβολή </p> <a href="/653030-Odoraua-mobile-apothiki.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/341861-Powerpoint-2003-einai-to-dimofilestero-programma-paroysiaseon.html">POWERPOINT 2003. Είναι το δημοφιλέστερο πρόγραμμα παρουσιάσεων.</a> </h3> <p> <img alt="POWERPOINT 2003. Είναι το δημοφιλέστερο πρόγραμμα παρουσιάσεων." title="POWERPOINT 2003. Είναι το δημοφιλέστερο πρόγραμμα παρουσιάσεων." class="news-block-img pull-right" src="/thumbs/19/341861.jpg"> POWERPOINT 2003 1. Τι είναι το PowerPoint (ppt)? Είναι το δημοφιλέστερο πρόγραμμα παρουσιάσεων. 2. Τι δυνατότητες έχει? Δημιουργία παρουσίασης. Μορφοποίηση παρουσίασης. Δημιουργία γραφικών. Δημιουργία </p> <a href="/341861-Powerpoint-2003-einai-to-dimofilestero-programma-paroysiaseon.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/1344514-Exoikeiosi-me-to-movie-maker.html">EΞΟΙΚΕΙΩΣΗ ΜΕ ΤΟ MOVIE MAKER</a> </h3> <p> <img alt="EΞΟΙΚΕΙΩΣΗ ΜΕ ΤΟ MOVIE MAKER" title="EΞΟΙΚΕΙΩΣΗ ΜΕ ΤΟ MOVIE MAKER" class="news-block-img pull-right" src="/thumbs/22/1344514.jpg"> EΞΟΙΚΕΙΩΣΗ ΜΕ ΤΟ MOVIE MAKER 1. Ανοίξτε από ΟΛΑ ΤΑ ΠΡΟΓΡΑΜΜΑΤΑ, το Windows movie maker 2. Αυτή είναι η βασική επιφάνεια εργασίας του λογισµικού Το movie maker µας δίνει δύο δυνατότητες. Να κάνουµε ένα </p> <a href="/1344514-Exoikeiosi-me-to-movie-maker.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/31758098-1-apaitiseis-ergasias.html">1. Απαιτήσεις εργασίας</a> </h3> <p> <img alt="1. Απαιτήσεις εργασίας" title="1. Απαιτήσεις εργασίας" class="news-block-img pull-right" src="/thumbs/53/31758098.jpg"> ctxxxxx.html 1 η ΕΡΓΑΣΙΑ: ΑΝΑΠΤΥΞΗ ΔΙΑΔΙΚΤΥΑΚΟΥ ΤΟΠΟΥ (WEB SITE) Ημερομηνία Παράδοσης: Τρίτη 1 Δεκέμβρη 2009 (Η εργασία είναι ατομική!!) 1. Απαιτήσεις εργασίας Θα πρέπει να δημιουργήσετε το web site μιας </p> <a href="/31758098-1-apaitiseis-ergasias.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/11664448-C-apo-ti-theoria-stin-efaruogi-2-o-kefalaio.html">C: Από τη Θεωρία στην Εφαρµογή 2 ο Κεφάλαιο</a> </h3> <p> <img alt="C: Από τη Θεωρία στην Εφαρµογή 2 ο Κεφάλαιο" title="C: Από τη Θεωρία στην Εφαρµογή 2 ο Κεφάλαιο" class="news-block-img pull-right" src="/thumbs/27/11664448.jpg"> C: Από τη Θεωρία στην Εφαρµογή Κεφάλαιο 2 ο Τύποι Δεδοµένων Δήλωση Μεταβλητών Έξοδος Δεδοµένων Γ. Σ. Τσελίκης Ν. Δ. Τσελίκας Μνήµη και Μεταβλητές Σχέση Μνήµης Υπολογιστή και Μεταβλητών Η µνήµη (RAM) ενός </p> <a href="/11664448-C-apo-ti-theoria-stin-efaruogi-2-o-kefalaio.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/844210-Iuioyrgia-istoselidon-ue-to-1-microsoft-frontpage.html">ηµιουργία ιστοσελίδων µε το 1 Microsoft FrontPage</a> </h3> <p> <img alt="ηµιουργία ιστοσελίδων µε το 1 Microsoft FrontPage" title="ηµιουργία ιστοσελίδων µε το 1 Microsoft FrontPage" class="news-block-img pull-right" src="/thumbs/18/844210.jpg"> ηµιουργία ιστοσελίδων µε το 1 Microsoft FrontPage Τι είναι µια ιστοσελίδα (Web page); Μια ιστοσελίδα (web page) είναι ένα αρχείο που εµφανίζεται στην οθόνη του υπολογιστή από ένα πρόγραµµα που λέγεται </p> <a href="/844210-Iuioyrgia-istoselidon-ue-to-1-microsoft-frontpage.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/41897722-7-a-1-paroysiaseis-7-a-2-perigrafi-periehomenon-tis-efarmogis.html">7.Α.1 Παρουσιάσεις. 7.Α.2 Περιγραφή περιεχομένων της εφαρμογής</a> </h3> <p> <img alt="7.Α.1 Παρουσιάσεις. 7.Α.2 Περιγραφή περιεχομένων της εφαρμογής" title="7.Α.1 Παρουσιάσεις. 7.Α.2 Περιγραφή περιεχομένων της εφαρμογής" class="news-block-img pull-right" src="/thumbs/58/41897722.jpg"> Μάθημα 7ο Πολυμέσα 7.Α.1 Παρουσιάσεις Οι παρουσιάσεις είναι μια εφαρμογή που χρησιμεύει στην παρουσίαση των εργασιών μας. Αποτελούν μια συνοπτική μορφή των εργασιών μας. Μέσω δημιουργίας διαφανειών, μορφοποιήσεων </p> <a href="/41897722-7-a-1-paroysiaseis-7-a-2-perigrafi-periehomenon-tis-efarmogis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/38563386-1-o-ergastirio-syntetagmenes-hromata-shimata.html">1 ο Εργαστήριο Συντεταγμένες, Χρώματα, Σχήματα</a> </h3> <p> <img alt="1 ο Εργαστήριο Συντεταγμένες, Χρώματα, Σχήματα" title="1 ο Εργαστήριο Συντεταγμένες, Χρώματα, Σχήματα" class="news-block-img pull-right" src="/thumbs/56/38563386.jpg"> 1 ο Εργαστήριο Συντεταγμένες, Χρώματα, Σχήματα 1. Σύστημα Συντεταγμένων Το σύστημα συντεταγμένων που έχουμε συνηθίσει από το σχολείο τοποθετούσε το σημείο (0,0) στο σημείο τομής των δυο αξόνων Χ και Υ. </p> <a href="/38563386-1-o-ergastirio-syntetagmenes-hromata-shimata.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/33828838-Kataskeyi-istoselidon-frontpagexp.html">Κατασκευή ιστοσελίδων (FrontPageXP)</a> </h3> <p> <img alt="Κατασκευή ιστοσελίδων (FrontPageXP)" title="Κατασκευή ιστοσελίδων (FrontPageXP)" class="news-block-img pull-right" src="/thumbs/54/33828838.jpg"> Κατασκευή ιστοσελίδων (FrontPageXP) Γραµµή τίτλου Γραµµή µενού Γραµµή εργαλείων Μορφοποίηση Εικόνα Εφέ DHTML Παράθυρο εργασιών Όταν ανοίγουµε το FrontPage, ανοίγει αυτόµατα µία νέα σελίδα. (Στο FrontPage </p> <a href="/33828838-Kataskeyi-istoselidon-frontpagexp.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/842968-Kataskeyi-istoselidon-frontpage.html">Κατασκευή ιστοσελίδων (FrontPage)</a> </h3> <p> <img alt="Κατασκευή ιστοσελίδων (FrontPage)" title="Κατασκευή ιστοσελίδων (FrontPage)" class="news-block-img pull-right" src="/thumbs/18/842968.jpg"> Κατασκευή ιστοσελίδων (FrontPage) Γραµµή τίτλου Γραµµή µενού Γραµµή εργαλείων Μορφοποίηση Εικόνα Πίνακες και περιγράµµατα Όταν ανοίγουµε το FrontPage, ανοίγει αυτόµατα µία νέα σελίδα. (Στο FrontPage τα </p> <a href="/842968-Kataskeyi-istoselidon-frontpage.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/8447288-Odigos-grigoris-ekkinisis.html">Οδηγός γρήγορης εκκίνησης</a> </h3> <p> <img alt="Οδηγός γρήγορης εκκίνησης" title="Οδηγός γρήγορης εκκίνησης" class="news-block-img pull-right" src="/thumbs/26/8447288.jpg"> Οδηγός γρήγορης εκκίνησης Το Microsoft Word 2013 έχει διαφορετική εμφάνιση από προηγούμενες εκδόσεις. Γι αυτό το λόγο, δημιουργήσαμε αυτόν τον οδηγό για να ελαχιστοποιήσουμε την καμπύλη εκμάθησης. Γραμμή </p> <a href="/8447288-Odigos-grigoris-ekkinisis.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/30561264-Allagi-prosanatolismoy-eggrafoy-se-katakoryfo-i-orizontio-allagi-megethoys-selidas.html">Αλλαγή προσανατολισμού εγγράφου σε κατακόρυφο ή οριζόντιο, αλλαγή μεγέθους σελίδας</a> </h3> <p> <img alt="Αλλαγή προσανατολισμού εγγράφου σε κατακόρυφο ή οριζόντιο, αλλαγή μεγέθους σελίδας" title="Αλλαγή προσανατολισμού εγγράφου σε κατακόρυφο ή οριζόντιο, αλλαγή μεγέθους σελίδας" class="news-block-img pull-right" src="/thumbs/52/30561264.jpg"> 3.3.3.1 Αλλαγή προσανατολισμού εγγράφου σε κατακόρυφο ή οριζόντιο, αλλαγή μεγέθους σελίδας Συνήθως εκτυπώνουμε κατά τη μακρόστενη μεριά της σελίδας. Αυτού του είδους ο προσανατολισμός ονομάζεται κατακόρυφος. </p> <a href="/30561264-Allagi-prosanatolismoy-eggrafoy-se-katakoryfo-i-orizontio-allagi-megethoys-selidas.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/35273886-Iuioyrgia-paroysiaseon-power-point.html">ηµιουργία παρουσιάσεων (Power Point)</a> </h3> <p> <img alt="ηµιουργία παρουσιάσεων (Power Point)" title="ηµιουργία παρουσιάσεων (Power Point)" class="news-block-img pull-right" src="/thumbs/54/35273886.jpg"> ηµιουργία παρουσιάσεων (Power Point) Το πρόγραµµα PowerPoint είναι η «αίθουσα προβολών» του Office. Μια προβολή του PowerPoint µπορεί να έχει ως στόχο να διδάξει, να εξηγήσει ή και να πείσει. Ό,τι φτιάχνουµε </p> <a href="/35273886-Iuioyrgia-paroysiaseon-power-point.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> <div class="news-blocks"> <h3> <a href="/37232380-Odigies-gia-tin-kataskeyi-toy-arheioy-taytotita-a-v-2-1-apokryptoyue-toys-axones-kai-to-parathyro-algevras-parathyro-provoli.html">Οδηγίες για την κατασκευή του αρχείου «Ταυτότητα (α+β) 2» 1. Αποκρύπτουµε τους άξονες και το παράθυρο άλγεβρας: Παράθυρο προβολή</a> </h3> <p> <img alt="Οδηγίες για την κατασκευή του αρχείου «Ταυτότητα (α+β) 2» 1. Αποκρύπτουµε τους άξονες και το παράθυρο άλγεβρας: Παράθυρο προβολή" title="Οδηγίες για την κατασκευή του αρχείου «Ταυτότητα (α+β) 2» 1. Αποκρύπτουµε τους άξονες και το παράθυρο άλγεβρας: Παράθυρο προβολή" class="news-block-img pull-right" src="/thumbs/55/37232380.jpg"> Οδηγίες για την κατασκευή του αρχείου «Ταυτότητα (α+β) 2» 1. Αποκρύπτουµε τους άξονες και το παράθυρο άλγεβρας: Παράθυρο προβολή απο-επιλέγουµε άξονες και άλγεβρα 2. Από το εργαλείο κατασκευής πολυγώνων </p> <a href="/37232380-Odigies-gia-tin-kataskeyi-toy-arheioy-taytotita-a-v-2-1-apokryptoyue-toys-axones-kai-to-parathyro-algevras-parathyro-provoli.html" class="news-block-btn"> Διαβάστε περισσότερα <i class="m-icon-swapright m-icon-black"></i> </a> </div> </div> <!-- END RIGHT SIDEBAR --> </div> </div> </div> <!-- END CONTENT --> </div> <!-- END SIDEBAR & CONTENT --> </div> </div> <!-- BEGIN FOOTER --> <div class="footer"> <div class="container"> <div class="row"> <!-- BEGIN COPYRIGHT --> <div class="col-md-10 col-sm-10 padding-top-10"> 2017 © DocPlayer.gr <a href="/support/privacy-policy/">Πολιτική Απορρήτου</a> | <a href="/support/terms-of-service/">Όροι Χρήσης</a> | <a href="/support/feedback/">Σχόλια</a> </div> <!-- END COPYRIGHT --> <!-- BEGIN PAYMENTS --> <div class="col-md-6 col-sm-6"> </div> <!-- END PAYMENTS --> </div> </div> </div> <!-- END FOOTER --> <!--[if lt IE 9]> <script src="/static/theme/global/plugins/respond.min.js"></script> <![endif]--> <script src="/static/js/836ca/total.js" type="text/javascript"></script> <div style="display: none;"> <script> var page_data = {"domain_id":30,"design_id":0,"page_id":0}; (function(){ var img = new Image(); var pixel_image_src = '/pix/'+Math.random()+'/report/pixel.gif?type=pageview&domain_id=30&page_id=0&design_id=0&l='+encodeURIComponent(navigator.language)+'&p='+encodeURIComponent(navigator.platform)+'&url='+encodeURIComponent(document.location); document.write('<img src="'+pixel_image_src+'"> '); }()); </script> </div> </body> </html>