ΠΛΗΡΟΦΟΡΙΑΚΑ & ΤΗΛΕΠΙΚΟΙΝΩΝΙΑΚΑ ΣΥΣΤΗΜΑΤΑ
|
|
|
- Ξενοφών Παπαδάκης
- 7 χρόνια πριν
- Προβολές:
Transcript
1 Οικονοµικό Πανεπιστήµιο Αθηνών Τµήµα ιοικητικής Επιστήµης & Τεχνολογίας ΠΛΗΡΟΦΟΡΙΑΚΑ & ΤΗΛΕΠΙΚΟΙΝΩΝΙΑΚΑ ΣΥΣΤΗΜΑΤΑ Κεφάλαιο 11 Eισαγωγή στην ανάπτυξη ιστοσελίδων µε HMTL Γιώργος Γιαγλής
2 Περίληψη Κεφαλαίου 11 Eισαγωγή στην ανάπτυξη ιστοσελίδων µε HMTL Βασικές έννοιες και ετικέτες της HTML Εισαγωγή λίστας, πίνακα, γραφικών, υπερσυνδέσµου, φόρµας Εισαγωγή στα Επικαλυπτόµενα Φύλλα Στυλ (CSS) 2
3 Γλώσσες Σήµανσης & HTML Προσδιορίζουν το τρόπο δόµησης ή εκτέλεσης µιας διαδικασίας ή εργασίας Η HTML (HyperText Markup Language) είναι µία από τις γλώσσες σήµανσης, η οποία χρησιµοποιείται για την κατασκευή ιστοσελίδων Υπερκείµενο (HyperText): ίνει τη δυνατότητα στο χρήστη να περιγιηθεί σε κείµενο και άλλες µορφές µε µη γραµµικό τρόπο, αλλά ακολουθώντας µια σειρά από συνδέσµους (links) H HTML είναι περιγραφική γλώσσα και υποδηλώνει στον περιηγητή ιστού(browser) µε ποιον τρόπο θα εµφανίσει µια ιστοσελίδα 3
4 Ετικέτες HTML Η HTML χρησιµοποιεί ετικέτες για να δώσει οδηγίες στον περιηγητή ιστού. Ετικέτες: Ειδικές εντολές Συνήθως ορίζουν την αρχή ή το τέλος µιας λειτουργίας Βρίσκονται πάντα µεταξύ των συµβόλων < και >. Κάθε εντολή τερµατίζει όταν ο browser διαβάζει την ίδια ετικέτα µε το πρόθεµα / (πχ. Εφαρµογή έντονης γραφής σε κείµενο: <b>text</b>) H HTML έχει κανονές στη συγγραφή της, οι οποίοι θα πρέπει να τηρούνται προκειµένου να η ιστοσελίδα να αναγνωρίζεται από όλους τους περιηγητές 4
5 Γράφοντας τον πρώτο HTML κώδικα οµή ενός HTML κειµένου: <HTML> </HTML> ηλώνει ότι ακολουθεί κείµενο τύπου HTML Περιλαµβάνει τις ετικέτες HEAD και BODY ιακρίνει µεταξύ των διαφορετικών εκδόσεων της HTML <HEAD> </HEAD> Περιλαµβάνει πληροφορίες που δεν εµφανίζονται ως µέρος του κειµένου, όπως τίτλος σελίδας, κωδικοποίηση κλπ. <TITLE> </TITLE> ηλώνει το τίτλος της σελίδας που θα εµφανιστεί στο πάνω µέρος του browser <BODY> </BODY> Περιλαµβάνει το περιεχόµενο της ιστοσελίδας Αποτελείται από άλλες επιπλέον ετικέτες που περιέχουν κείµενο 5
6 Παράδειγµα <HTML> </HTML> <HEAD> <! Ακολουθεί το τίτλος της ιστοσελίδας --> <TITLE>Hello World!</TITLE> </HEAD> <BODY> This is my first HTML website! </BODY> 6
7 H ετικέτα BODY Αποτελεί µία από τις µεγάλες ενότητες που ενσωµατώνονται ανάµεσα στις ετικέτες <HTML> (η άλλη είναι η <ΗΕAD>) Οτιδήποτε πληροφορία βρίσκεται ανάµεσα στις ετικέτες <BODY> θα εµφανιστεί στην οθόνη του επισκέπτη. Τα περιεχόµενα της ετικέτας <BODY> µπορεί να είναι: Κείµενο Άλλες ετικέτες µαζί µε ιδιότητες και γνωρίσµατα ΓΝΩΡΙΣΜΑ BGCOLOR ΤΕΧΤ LINK VLINK ALINK BACKGROUND TOPMARGIN LEFTMARGIN ΠΕΡΙΓΡΑΦΗ Υποδηλώνει το χρώµα φόντου της ιστοσελίδας Υποδηλώνει το χρώµα όλου του κειµένου Υποδηλώνει το χρώµα κάθε υπερσυνδέσµου που δεν έχουµε επισκεφτεί Υποδηλώνει το χρώµα κάθε υπερσυνδέσµου που έχουµε επισκεφτεί τουλάχιστον µια φορά Υποδηλώνει το χρώµα κάθε υπερσυνδέσµου που είναι ενεργός τη στιγµή της σύνδεσης Τοποθέτηση µια εικόνας ως φόντο της ιστοσελίδας Υποδηλώνει το µέγεθος των άνω και κάτω περιθωρίων (σε pixels) Υποδηλώνει το µέγεθος των δεξιά και αριστερά περιθωρίων (σε pixels) 7
8 Παράδειγµα <HTML> </HTML> <HEAD> <! Ακολουθεί το τίτλος της ιστοσελίδας --> <TITLE>Hello World!</TITLE> </HEAD> <BODY BGCOLOR= #AA0000 TEXT= #FFFF00 > This is my first HTML website! </BODY> 8
9 Βασικές Ετικέτες Κειµένου ΕΤΙΚΕΤΑ <P>...</P> <B> </B> <I> </I> <U> </U> <BR> <HR> <PRE> <H1> </H1> <H2> </H2> <H5> </H5> ΠΕΡΙΓΡΑΦΗ ηλώνει την αρχή και το τέλος µιας παραγράφου (µπορεί να έχει γνωρίσµατα, όπως ALIGN δηλαδή στοίχιση) Κείµενο µε έντονη γραφή Κείµενο σε πλάγια γραφή Υπογραµµισµένο κείµενο ηλώνει ένα τερµατισµό γραµµής (break line) Τοποθέτηση µια οριζόντιας γραµµής (Γνωρίσµατα: WIDTH, SIZE, ALIGN) Εµφανίζει το κείµενο όπως ακριβώς το έχουµε γράψει ανάµεσα στις ετικέτες Ορισµός επικεφαλίδας σε ένα κείµενο HTML. Οι επικεφαλίδες υποδηλώνουν την ιεραρχία που υπάρχει µεταξύ των διαφορετικών «περιοχών» ενός κειµένου. 9
10 Βασικές Ετικέτες Κειµένου ΕΤΙΚΕΤΑ <FONT> </FONT> ΓΝΩΡΙΣΜΑΤΑ <FONT> FACE ΠΕΡΙΓΡΑΦΗ Εφαρµογή τύπου, µεγέθους και χρώµατος γραµµατοσειράς. ΠΕΡΙΓΡΑΦΗ Ορίζει το τύπο της γραµµατοσειράς (πχ. Arial, Tahoma κλπ) SIZE Ορίζει το µέγεθος της γραµµατοσειράς από 1-7 COLOR Ορίζει το χρώµα της γραµµατοσειράς, µε το ίδιο τρόπο που ορίζουµε χρώµα στο BGCOLOR 10
11 Παράδειγµα <HTML> </HTML> <HEAD> <! Ακολουθεί το τίτλος της ιστοσελίδας --> <TITLE>Hello World!</TITLE> </HEAD> <BODY BGCOLOR= #AA0000 TEXT= #FFFF00 > <P>This is my <B>first</B> <U>HTML</U> <I>website</I></P> <PRE> Hello World!!! My Name Is Chris</PRE> <BR> <H1>Headline Style 1</H1> <HR WIDTH= 80% ALIGN= center SIZE= 2 > <FONT FACE= Arial SIZE= 3 COLOR= #cccccc >How are you?</font> </BODY> 11
12 Στην πράξη... 12
13 Λίστες Για τη δηµιουργία µη αριθµηµένων λιστών χρησιµοποιούµε την ετικέτα <UL>, η οποία προσδιορίζει την έναρξη της λίστας. Για τη δηµιουργία αριθµηµένης λίστας χρησιµοποιούµε την ετικέτα <OL>. Κάθε στοιχείο της λίστας προσδιορίζεται µε την ετικέτα <LI>, η οποία δεν απαιτείται να κλείσει. ΠΑΡΑ ΕΙΓΜΑ <ΒΟDY> <OL> </OL> </BODY> <LI>Πρώτο στοιχείο <LI> εύτερο στοιχείο <UL> <LI>Πρώτο µη-αριθµηµένης λίστας </UL> 13
14 Πίνακες Η χρήση πινάκων στην HTML είναι διαδεδοµένος τρόπος δόµησης του κειµένου. Για τη δηµιουργία ενός πίνακα χρησιµοποιούµε τις εξής 4 ετικέτες. ΕΤΙΚΕΤΑ TABLE TR TD TH ΠΕΡΙΓΡΑΦΗ Η βασική ετικέτα δηµιουργίας πίνακα. Η πλειοψηφία των ιδιοτήτων του κάθε πίνακα προσδιορίζονται στη συγκεκριµένη ετικέτα. Προσδιορίζει κάθε γραµµή του πίνακα Προσδιορίζει τα περιεχόµενα κάθε κελιού του πίνακα Αποτελεί ειδικό τύπο ετικέτας, ο οποίος αποδίδει στα περιεχόµενα ενός κελιού την έννοια της επικεφαλίδας, εµφανίζοντας το κείµενο µε έντονο χρώµα. 14
15 Γνωρίσµατα ετικέτας TABLE ΓΝΩΡΙΣΜΑ BORDER CELLPADDING CELLSPACING BGCOLOR ΠΕΡΙΓΡΑΦΗ Υποδηλώνει το µέγεθος του περιγράµµατος ενός πίνακα (σε pixels) Προσδιορίζει το κενό χώρο ανάµεσα στα περιεχόµενα των κελιών και το περίγραµµα του κάθε κελιού Προσδιορίζει το κενό διάστηµα ανάµεσα στις εσωτερικές γραµµές που διαχωρίζουν τα κελιά Προσδιορίζει το χρώµα φόντου που θα έχουν τα κελιά του πίνακα Γνωρίσµατα ετικετών TD και TH ΓΝΩΡΙΣΜΑ ALIGN VALIGN ROWSPAN COLSPAN ΠΕΡΙΓΡΑΦΗ Υποδηλώνει την οριζόντια στοίχιση του κειµένου (LEFT, CENTER, RIGHT) Υποδηλώνει την κατακόρυφη στοίχιση του κειµένου (TOP, MIDDLE, BOTTOM) Προσδιορίζει τον αριθµό των σειρών που θα καταλαµβάνει το κελί Προσδιορίζει τον αριθµό των στηλών που θα καταλαµβάνει το κελί 15
16 Παράδειγµα <BODY> <TABLE BORDER=1> <TR> <TD ROWSPAN=2>Grammi1-2 Stili1</TD> <TD ALIGN= CENTER COLSPAN=2>Grammi1 Stiles2-3</TD> </TR> <TR> <TD ROWSPAN=2>Grammi2 Stili2</TD> <TD>Grammi2 Stili3</TD> </TR> </TABLE> </BODY> 16
17 Εισαγωγή Εικόνων Μέσω της HTML µπορούµε να εισάγουµε εικόνες στις ιστοσελίδες µας. Η ετικετά η οποία εισάγει εικόνες είναι η IMG Τα γνωρίσµατα της IMG είναι: SRC: η πηγή, δηλαδή η διαδροµή της εικόνας στον υπολογιστή ALT: Σε περίπτωση που ο browser δεν µπορεί να εµφανίσει την εικόνα θα δείχνει το µήνυµα που θα έχει το γνώρισµα ALT ALIGN: Προσδιορίζει την ευθυγράµµιση της εικόνας σε σχέση µε το κείµενο γύρω της (LEFT, RIGHT, TOP, TEXTTOP, MIDDLE, ABSMIDDLE, BOTTOM, ABSBOTTOM, BASELINE BORDER: Προσδιορίζει το µέγεθος του περιγράµµατος της εικόνας HEIGHT: Προσδιορίζει το κάθετο µήκος της εικόνας σε pixels WIDTH: Προσδιορίζει το οριζόντιο µήκος της εικόνας σε pixels ΠΑΡΑ ΕΙΓΜΑ <IMG SRC= C:/documents/myphotos/1.JPG ALT= sport ALIGN= LEFT BORDER=1 WIDTH=40%> 17
18 Εισαγωγή Υπερσυνδέσµων Το σηµαντικότερο χαρακτηριστικό της HTML είναι η λογική των υπερσυνδέσµων. Οι υπερσύνδεσµοι αποτελούνται από δύο µέρη: Αυτό που βλέπουν οι χρήστες (κείµενο, εικόνα κλπ) Το URL, η διεύθυνση δηλαδή στην οποία θα κατευθυνθεί ο browser. Η ετικέτα που µας επιτρέπει να εισάγουµε υπερσυνδέσµους είναι η <A> Γνωρίσµατα της ετικέτας <A>: HREF: Προσδιορίζει τη διεύθυνση της ιστοσελίδας ή αρχείου που αναφερόµαστε (πλήρης αναφορά, σχετική αναφορά) NAME: ηµιουργία ονόµατος ενός συνδέσµου εντός της ιστοσελίδας TARGET: Προσδιορίζει το τρόπο µε τον οποίο θα χειριστεί ο browser το άνοιγµα του υπερσυνδέσµου (_blank για νέο παράθυρο, _self στο ίδιο παράθυρο, _parent στο προηγούµενο ιεραρχικά frame, _top σε νέο παράθυρο µε άνοιγµα ξανά του browser. ΠΑΡΑ ΕΙΓΜΑ <A HREF= target= _blank > ΕΙΤΕ ΤΟ SITE ΜΟΥ</A> 18
19 Φόρµες Μια φόρµα δεδοµένων µας επιτρέπει τη συλλογή πληροφοριών από το χρήστη Τα στοιχεία µιας φόρµας µπορεί να είναι: Πεδία κειµένου (text fields) Πεδία κωδικών (password fields) Πεδία περιοχής κειµένου (text area fields) Κουµπιά επιλογής (radio buttons) Πλαίσια ελέγχου (checkboxes) Λίστες επιλογή (drop-down lists) Η ετικέτα για τη δηµιουργία µιας φόρµας είναι η <FORM> Βασικά γνωρίσµατα ετικέτας FORM: ACTION: Καθορίζει τη διαδικτυακή διεύθυνση αποστολής των δεδοµένων METHOD: Καθορίζει το τρόπο αποστολής των δεδοµένων POST: Αποστέλλει τα δεδοµένα ως ξεχωριστές µεταβλητές GET: Αποστέλλει τα δεδοµένα ως µία ενιαία συµβολοσειρά ΠΑΡΑ ΕΙΓΜΑ <FORM ACTION= METHOD=POST> 19
20 Πεδία Φόρµας Η πιο ευέλικτη ετικέτα για την εισαγωγή δεδοµένων είναι η <INPUT>, η οποία επιτρέπει τον ορισµό διαφόρων τρόπος εισαγωγής δεδοµένων. Ο τρόπος εισαγωγής ορίζεται µέσω του γνωρίσµατος TYPE Βασικά γνωρίσµατα της ετικέτας <INPUT>: ΓΝΩΡΙΣΜΑ TYPE NAME SIZE VALUE MAXLENGTH ΠΕΡΙΓΡΑΦΗ Προσδιορίζει το τρόπο εισαγωγής δεδοµένων και δέχεται τις παρακάτω τιµές: -TEXT (πεδίο κειµένου) -PASSWORD (πεδίο κωδικού) -HIDDEN (µη ορατό πεδίο µε σκοπό να αποδώσουµε τιµές σε µεταβλητές που δεν επιθυµούµε να τις αλλάξουν οι χρήστες -CHECKBOX (πολλαπλές επιλογές) -RADIO (πεδίο µοναδικής επιλογής) -SUBMIT (Κουµπί αποστολής δεδοµένων) -RESET (Κουµπί καθαρισµού των δεδοµένων που έχουν πληκτρολογηθεί) Προσδιορίζει το όνοµα της µεταβλητής στην οποία θα αποδωθεί τιµή Προσδιορίζει το πλάτος του πεδίου εισαγωγής δεδοµένων Προσδιορίζει ένα προεπιλεγµένο κείµενο το οποίο θα εµφανίζεται στο πεδίο Προσδιορίζει το µέγιστο αριθµό χαρακτήρων που µπορεί να εισάγει ο χρήστης στο πεδίο 20
21 Πεδίο Εισαγωγής Κειµένου Για την εισαγωγή δεδοµένων τα οποία δεν µπορούν να τοποθετηθούν µόνο σε ένα πλαίσιο κειµένου της µιας γραµµής, χρησιµοποιούµε την ετικέτα <TEXTAREA> η οποία επιλύει αυτό το πρόβληµα, καθώς επιτρέπει στους χρήστες να εισάγουν πολλές γραµµές κειµένου Η <TEXTAREA> δέχεται τα εξής γνωρίσµατα: NAME: Προσδιορίζει το όνοµα της µεταβλητής που θα αποθηκευτούν τα δεδοµένα COLS: Προσδιορίζει το πλάτος του πλαισίου κειµένου ROWS: Προσδιορίζει τον αριθµό των γραµµών που θα έχει το πλαίσιο κειµένου 21
22 ηµιουργία πτυσσόµενων λιστών Για τη δηµιουργία πτυσσόµενων λιστών (είτε µοναδικής επιλογής είτε πολλαπλής) χρησιµοποιούµε την ετικέτα <SELECT> Η ετικέτα <SELECT> εµπεριέχει έναν αριθµό επιλογών καθένα των οποίων αποτελεί µία από τις διαθέσιµες επιλογές Καθε επιλογή προσδιορίζεται µέσω της ετικέτας <OPTION> Η ετικέτα <SELECT> έχει τα εξής γνωρίσµατα: ΓΝΩΡΙΣΜΑ NAME SIZE MULTIPLE ΠΕΡΙΓΡΑΦΗ Προσδιορίζει το όνοµα της µεταβλητής στην οποία θα αποδωθεί τιµή Προσδιορίζει τον αριθµό των γραµµών από τη λίστα που θα εµφανιστούν στο browser Προσδιορίζει εάν η λίστα είναι πολλαπλών επιλογών. Αρκεί να αναφέρουµε το γνώρισµα. εν απαιτείται να δώσουµε κάποια τιµή 22
23 Παράδειγµα <FORM ACTION= METHOD= POST > Name: <INPUT TYPE= text NAME= name ><BR> Password: <INPUT TYPE= password NAME= password SIZE= 25 ><BR> <INPUT TYPE=radio NAME= sex VALUE=male> Male<BR> <INPUT TYPE=radio NAME= sex VALUE=female> Female<BR> Favorite Color: <BR> <INPUT TYPE=checkbox NAME= o1 VALUE=Red CHECKED> Red<BR> <INPUT TYPE=checkbox NAME= o2 VALUE=Green> Green<BR> Favorite Car: <BR> <SELECT MULTIPLE size= 4 NAME= car-select > <OPTION SELECTED VALUE= car1 >Honda</OPTION> <OPTION VALUE= car2 >Audi</OPTION> <OPTION VALUE= car3 >BMW</OPTION> </SELECT><BR><BR> <INPUT TYPE=submit VALUE=Send> <INPUT TYPE=reset VALUE=Reset> </FORM> 23
24 Στην πράξη... 24
25 Πλαίσια Τα πλαίσια (frames) παρέχουν τη δυνατότηταν πολλαπλών «οθονών» χωρίζοντας ουσιαστικά την HTML σελίδα σε πολλά ανεξάρτητα µέρη Η δοµή της ιστοσελίδας αναφέρεται σε µια κεντρική ιστοσελίδα που «καλεί» όλες τις υπόλοιπες Στην κεντρική σελίδα αντί για την ετικέτα <BODY> χρησιµοποιούµε την ετικέτα <FRAMESET> H <FRAMESET> προσδιορίζει όλα τα χαρακτηριστικά του ιστοτόπου που αφορούν τον αριθµό και το σχετικό µέγεθος των πλαισίων. Γνωρίσµατα της ετικέτας <FRAMESET>: ΓΝΩΡΙΣΜΑ ROWS COLS FRAMEBORDER ΠΕΡΙΓΡΑΦΗ Ορίζει τις γραµµές για οριζόντια δόµηση της ιστοσελίδας (% ή σε pixels) Ορίζει τις στήλες για κάθετη δόµηση της ιστοσελίδας (% ή σε pixels) Ορίζει εάν ανάµεσα στα πλαίδια θα υπάρχει περιθώριο 25
26 Πλαίσια Εντός της ετικέτας <FRAMESET> χρησιµοποιούµε την ετικέτα <FRAME> για να ορίσουµε το πλήθος των πλαισίων. Βασικά γνωρίσµατα ετικέτας <FRAME>: ΓΝΩΡΙΣΜΑ SRC NAME BORDER SCROLLING ΠΕΡΙΓΡΑΦΗ Ορίζει τη διεύθυνση του αρχείου που αναφέρεται το πλαίσιο (καλούµε ένα ξεχωριστό αρχείο HTML) Ορίζει το όνοµα του πλαισίου. Κάθε πλαίσιο πρέπει να έχει µοναδικό όνοµα. Ορίζει εάν το πλαίσιο θα έχει περιθώριο Ρυθµίζει την εµφάνιση ή όχι της γραµµής ολίσθησης µέσα στο πλαίσιο. Λαµβάνει τιµές YES NO AUTO 26
27 Παράδειγµα index.html <FRAMESET COLS= 150,* > <FRAME SRC= menu.html > <FRAME SRC= homepage.html NAME= main > </FRAMESET> <NOFRAMES> This is what someone would see if they have a web browser that cannot display frames </NOFRAMES> menu.html <UL> <LI><A HREF= audi.html TARGET= main >Audi</A> <LI><A HREF= bmw.html TARGET= main >BMW</A> </UL> 27
28 Επικαλυπτόµενα Φύλλα Στυλ (CSS) Τα επικαλυπτόµενα Φύλλα Στυλ (Cascading Style Sheets) αποτελούν µία απο τις σηµαντικότερες βελτιώσεις που εισήγαγε η HTML Τα CSS παρέχουν ένα σύνολο κανόνων για επιλεγµένα στοιχεία-ετικέτες, ελέγχοντας το τρόπο µε τον οποίο θα εµφανίζεται κάθε στοιχείο της ιστοσελίδας Τα CSS επιτρέπουν τη συγκεντρωτική µορφοποίηση µιας ιστοσελίδας Οι κανόνες αυτοί εισάγονται στην ετικέτα <HEAD> Τα CSS δεν αποτελούνται από ετικέτες και δεν συντάσσονται µέσα σε <> Τα CSS ενσωµατώνονται µέσα σε µια ιστοσελίδα ή αποτελούν εξωτερικό αρχείο το οποίο καλείται Υπάρχουν 3 τρόποι ενσωµάτωσης των ιδιοτήτων CSS σε µια ιστοσελίδα: Ενσωµάτωση της ετικέτας <STYLE> εντός της ενότητας <HEAD> του εγγράφου <HTML> ηµιουργία δεσµού µε κάποιο εξωτερικό αρχείο µέσω της ετικέτας <LINK> Χρησιµοποίηση του γνωρίσµατος STYLE= στις ετικέτες της HTML. Αναφέρεται σε µεµονωµένη µορφοποίηση κάθε ετικέτας. 28
29 Κανόνες CSS Η λογική των CSS υλοποιείται µέσω κανόνων. Κάθε κανόνας αποτελείται από δύο διακριτά στοιχεία: Τον ΕΠΙΛΟΓΕΑ (Selector): Η λογική διασύνδεση µεταξύ της ιστοσελίδας και της µορφοποίησης που επιθυµούµε να εφαρµόσουµε Τη ΗΛΩΣΗ (Declaration): Αποτελεί τον ορισµό των τιµών για κάθε ετικέτα που θέλουµε να διαµορφώσουµε µε συγκεκριµένο τρόπο. Κάθε δήλωση αποτελείται από δύο µέρη: µία ιδιότητα και µία τιµή ΣΥΝΤΑΞΗ Επιλογέας {Ιδιότητα: Τιµή; Ιδιότητα: Τιµή; Ιδιότητα: Τιµή;...} ΠΑΡΑ ΕΙΓΜΑ <HEAD> <STYLE TYPE= TEXT/CSS > BODY{ COLOR: RED; BACKGROUND-COLOR: YELLOW; } </STYLE> </HEAD> 29
30 Γνωρίσµατα µορφοποίησης γραµµατοσειράς ΓΝΩΡΙΣΜΑ Font-family Font-size Font-style ΠΕΡΙΓΡΑΦΗ Ο τύπος της γραµµατοσειράς (Times, Helvetica, Courier New, Arial Το µέγεθος της γραµµατοσειράς (σε στοιχεία pt ή σε ποσοστιαία απόκλιση από το τυπικό µέγεθος) Το στυλ της γραµµατοσειράς (bold, italic, oblique) Font-weight Το πάχος της γραµµατοσειράς (normal, bold, blolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900) 30
31 Κλάσεις CSS Οι κλάσεις χρησιµοποιούνται για να διαχωρίσουν το στυλ που εφαρµόζεται σε κάθε ετικέτα. Πρακτικά, σε κάθε κανόνα αντιστοιχίζεται ένα µοναδικό όνοµα, το οποίο στη συνέχεια προσαρτάται στον επιλογέα µε χρήση του χαρακτήρα της τελείας. CSS p.right {text-align: right} p.center {text-align: center} HTML <p class= right > This paragraph will be right-aligned. </p> <p class= center > This paragraph will be center-aligned. </p> *Μπορούµε να µην αναφέρουµε καθόλου το τύπο της ετικέτας στον επιλογέα, εφόσον θέλουµε να ορίσουµε ενα στυλ το οποίο θα χρησιµοποιηθεί από όλα τα HTML στοιχεία που ανήκουν σε µια συγκεκριµένη κλάση πχ.center {text-align: center} 31
32 Ετικέτα <LINK> & Μορφοποίηση σε µεµονωµένη ετικέτα Η ετικέτα <LINK> µας επιτρέπει να συµπεριλάβουµε αρχεία CSS σε HTML κώδικα. Με αυτό το τρόπο µπορούµε να κάνουµε συγκεντρωτικές αλλαγές στο CSS και όχι σε ένα-ένα HTML αρχείο ξεχωριστά. Η ετικέτα <LINK> ενσωµατώνεται στην ετικέτα <HEAD> και έχει την παρακάτω σύνταξη: <link rel= stylesheet type= text/css href= mystyle.css > Άλλος τρόπος αλλαγής της µορφοποίησης είναι το γνώρισµα STYLE σε µεµονωµένες ετικέτες. πχ. <p style= color: red > This is a paragraph </p> 32
33 Βασικά & χρήσιµα γνωρίσµατα ΓΝΩΡΙΣΜΑ ΠΕΡΙΓΡΑΦΗ Τιµές color Χρώµα κειµένου χρώµα direction Προσανατολισµός κειµένου Ltr, rtl line-height Απόσταση µεταξύ γραµµών Normal, Αριθµός, Μήκος, % letter-spacing Απόσταση µεταξύ χαρακτήρων Normal, µήκος text-align Στοίχιση κειµένου Left, center, right, justify text-decoration Μορφοποίηση κειµένου None, underline, overline, linethrough, blink text-shadow Επίπεδο σκίασης κειµένου None, χρώµα, µήκος text-transform Επίπεδο γραµµατοσειράς None, capitalize, uppercase, lowercase word-spacing Απόσταση µεταξύ των λεξέων σε µια παράγραφο normal, µήκος 33
Άσκηση 6 Επαναληπτική Άσκηση HTML
Άσκηση 6 Επαναληπτική Άσκηση HTML ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει τον τύπο του αρχείου Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο
Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML
Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο για το αρχείο Ορίζει το σώµα της background URL
Η γλώσσα HTML. Επιμέλεια: Δέγγλερη Σοφία
Η γλώσσα HTML Επιμέλεια: Δέγγλερη Σοφία Υπερκείμενο Το δομικό χαρακτηριστικό του Παγκόσμιου Ιστού Ένα αρχείο Απλό κείμενο και υπερσύνδεσμοι Υπερσύνδεσμος Μετάβαση σε διάφορα άλλα έγγραφα Αποτελείται από
Ετικέτες HTML. <!-->: Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον
Ετικέτες HTML : Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον πηγαίο κώδικα για να διευκολύνουμε την επεξεργασία και την συντήρηση του αρχείου. Τα σχόλια δεν εμφανίζονται στην οθόνη
<a href="http://www.somepage.com/somepage.html">μετάβαση στο κείμενο</a>.
HTML Τα αρχεία της HTML έχουν ετικέτες (tags) που ορίζουν τη δομή και τη μορφοποίηση των ιστοσελίδων. Οι περισσότερες HTML ετικέτες τις συναντούμε ως ζεύγη τα οποία ενεργούν στα περιεχόμενα μεταξύ των
HTML... 1. Εισαγωγή στην HTML και τα CSS
HTML...... 1 Εισαγωγή στην HTML και τα CSS HTML...... 2 HTML. H HTML (HYPERTEXT MARKUP LANGUAGE), είναι µία γλώσσα η οποία «λέει» στον υπολογιστή πως θα πρέπει να εµφανίσει µία ιστοσελίδα. Τα αρχεία στα
Άσκηση 5 -Δηµιουργία ιστοσελίδων µε HTML µέρος 5 ο
Άσκηση 5 -Δηµιουργία ιστοσελίδων µε HTML µέρος 5 ο HTML Φόρµες Για να δηµιουργήσουµε µια φόρµα στην οποία θα γράφουν σχόλια ή παρατηρήσεις οι επισκέπτες των σελίδων µας, χρειαζόµαστε την ετικέτα .
Εισαγωγή σε HTML και CSS. Παναγιώτης Τσαρχόπουλος
Εισαγωγή σε HTML και CSS Παναγιώτης Τσαρχόπουλος Περιεχόμενα Εισαγωγικές έννοιες Ορολογία και σύνταξη Κείμενο σε HTML έγγραφα Σύνδεσμοι Ψηφιακές - Ευφυείς Πόλεις - Εισαγωγή σε HTML και CSS 2 Εισαγωγικές
Εισαγωγή στην Επιστήμη Υπολογιστών. Εισαγωγή στην HTML. Άννα Κεφάλα Παναγιώτα Μιχόλια
Εισαγωγή στην Επιστήμη Υπολογιστών Εισαγωγή στην HTML Άννα Κεφάλα Παναγιώτα Μιχόλια Εργαστηριακές Σημειώσεις ΕΙΣΑΓΩΓΗ ΣΤΗ ΓΛΩΣΣΑ HTML ΜΕΡΟΣ Β': CSS ΚΑΙ FORMS 2 Cascading Style Sheets (CSS) Cascading Style
ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ
ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ Κεφάλαιο 4. Η γλώσσα HTML Επιμέλεια: Καραγιάννης Σπύρος Καθηγητής ΠΕ19 Βασικοί κανόνες σύνταξης HTML ομή σελίδας HTML Μορφοποίηση κειμένου Κατάλογοι Εισαγωγή
ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ
ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ Βαγγελιώ Καβακλή Τμήμα Πολιτισμικής Τεχνολογίας & Επικοινωνίας 8 Μαρτίου 2001 Hypertext Markup Language (HTML)! Σε μια ιστοσελίδα μπορούν να εμφανίζονται διαφορετικά
Cascading Style Sheets (CSS)
Cascading Style Sheets (CSS) Τα Cascading Style Sheets προσφέρουν έναν εύκολο τρόπο για να ορίσουμε τη μορφοποίηση που επιθυμούμε να έχουν οι σελίδες μία τοποθεσίας του Παγκόσμιου Ιστού που δημιουργούμε.
Διάλεξη 2η Εισαγωγή στο CSS
Διάλεξη 2η Εισαγωγή στο CSS Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e c o d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Τι είναι το CSS? Γιατί να χρησιμοποιήσω
Εργαλεία Ανάπτυξης Εφαρμογών Internet. Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής
Εργαλεία Ανάπτυξης Εφαρμογών Internet Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής Το πρότυπο CSS Α Μέρος 2 CSS (Cascading Style Sheets)(1) Ορίζουν την εμφάνιση των στοιχείων σε ένα έγγραφο HTML.
Πίνακες. ιδιότητες ετικέτας <tr>
Πίνακες ιδιότητες ετικέτας Ιδιότητα align στοιχίζει κατά την οριζόντια διεύθυνση τα περιεχόμενα μιας γραμμής του πίνακα αριστερά (left), δεξιά (right), στο κέντρο (center), ή με πλήρη στοίχιση (justify)
11. Η γλώσσα HTML Πίνακες, Λίστες, Φόρμες
11. Η γλώσσα HTML Πίνακες, Λίστες, Φόρμες Σκοπός του Εργαστηρίου: Σκοπός της παρούσας εργαστηριακής άσκησης είναι η εμβάθυνση σε συχνά χρησιμοποιούμενες ετικέτες HTML, όπως οι πίνακες και οι λίστες, καθώς
Νέες Τεχνολογίες στην Εκπαίδευση
Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Επάλληλα φύλλα στυλ (CSS): Μια εισαγωγή Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης
Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS)
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS) Γαβαλάς Δαμιανός dgavalas@aegean.gr Επικαλυπτόμενα Φύλλα Στυλ (Cascading Style Sheets, CSS) Η (X)HTML προσδιορίζει τη βασική
Προγραμματισμός Διαδικτύου
Πανεπιστήμιο Δυτικής Μακεδονίας Τμήμα Μηχανικών Πληροφορικής & Τηλεπικοινωνιών Προγραμματισμός Διαδικτύου Δρ. Μηνάς Δασυγένης mdasygenis@uowm.gr Τμήμα της παρουσίασης δημιουργήθηκε από τον κ. Παναγιώτη
Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας
Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας Δικτυακά Πολυμέσα Ι (Β Έτος, 3ο εξ) Διάλεξη #5η: HTML: πίνακες (tables), πλαίσια (frames) Γαβαλάς Δαμιανός
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II Εισαγωγή Εικόνων Οι φυλλομετρητές μπορούν να εμφανίσουν ένθετες
ΑΣΠΑΙΤΕ. ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ 4α. Υπερκείμενο και HTML. Ημερομηνία :... Τμήμα :... Ονοματεπώνυμο :...
ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ 4α Υπερκείμενο και HTML ΑΣΠΑΙΤΕ Ημερομηνία :... Τμήμα :... Ονοματεπώνυμο :... Η HTML (HyperText Markup Language) είναι η γλώσσα που χρησιμοποιείται για να περιγράψει τη δομή και τη διαμόρφωση
2. ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ
2014 2. ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ H HTML είναι μία γλώσσα σήμανσης και αποτελεί την κύρια γλώσσα δημιουργίας ιστοσελίδων του διαδικτύου. Είναι το ακρωνύμιο των λέξεων HyperText
Α ΛΥΚΕΙΟΥ - ΕΦΑΡΜΟΓΕΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΜΑΪΟΣ 2019 ΕΝΔΕΙΚΤΙΚΕΣ ΕΡΩΤΗΣΕΙΣ ΚΑΤΑΝΟΗΣΗΣ
Το υλικό αυτό δίνεται στους μαθητές για τη σωστή μελέτη της διδαχθείσας ύλης του μέρους Β. Πρόκειται για ένα συμπαγή κορμό ερωτήσεων και ασκήσεων οι οποίες καλύφθηκαν κατά τη διάρκεια της έως τώρα σχολικής
Συλλογή και Επεξεργασία Δεδομένων με Φόρμες
Συλλογή και Επεξεργασία Δεδομένων με Φόρμες Οι φόρμες αποτελούν τον πιο δημοφιλή τρόπο για τη συλλογή δεδομένων μέσω του World Wide Web (WWW). Επιτρέπουν στους χρήστες να επικοινωνούν με τη βοήθεια του
Διάλεξη 3η HTML intermediate
Διάλεξη 3η HTML intermediate Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e. c o. d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Επέκταση γνώσεων στην html
Πίνακες. ετικέτα <table>
Πίνακες ετικέτα σύνταξη κελί 1 κελί 2 κελί 3 κελί 4 : πίνακας : γραμμή : κελί Ιδιότητα border border : ορίζει
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
Εισαγωγή στην HTML Τα tags της HTML και τα γνωρίσματά τους
Εισαγωγή στην HTML Τα tags της HTML και τα γνωρίσματά τους Με την γλώσσα περιγραφής υπερ-κειμένου (HTML) μπορούμε να σχεδιάζουμε ιστοσελίδες. Η HyperText Markup Language βασίζεται στην SGML (Standard Generalized
Στην τεχνολογία των CSS, οι κανόνες στυλ (style
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #4 0 : CSS: Βασικές και προχωρημένες τεχνικές επιλογής, τα στοιχεία και , ψευδο κλάσεις και ψευδο επιλογείς Γαβαλάς Δαμιανός dgavalas@aegean.gr CSS κανόνες στυλ
3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ
2014 3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ Εισαγωγή Το CSS (Cascading Style Sheets) είναι αρχεία με κατάληξη.css τα οποία καθορίζουν την μορφοποίηση των ιστοσελίδων. Μέσω αυτών επιτυγχάνεται
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I Διαδικτυακή Εφαρμογή (1/2) Ως διαδικτυακή εφαρμογή μπορούμε
Γαβαλάς Δαμιανός dgavalas@aegean.gr
Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας Δικτυακά Πολυμέσα IΙ (Β Έτος, 4ο εξ) Εργαστήριο #3ο: Ορισμός επιλογέων, μορφοποίηση με CSS Γαβαλάς Δαμιανός
Εισαγωγη στην html. Η δομή μιας ιστοσελίδας (αρχείο html) Η βασική δομή ενός αρχείου html είναι η εξής: <html> <head>
Εισαγωγη στην html Ο παγκόσμιος ιστός (αγγ.: World Wide Web ή www) είναι η πιο δημοφιλής υπηρεσία που μας παρέχει το Διαδίκτυο (Internet) και είναι ένα σύστημα διασυνδεδεμένων πληροφοριών (κειμένου, εικόνας,
Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας
Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας µέσω της τεχνολογίας των ιαδοχικών Φύλλων Στυλ (cascading
Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου.
Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου. 1 η ΑΣΚΗΣΗ Οι HTML σελίδες είναι απλές σελίδες κειμένου και μπορούν να δημιουργηθούν από οποιοδήποτε πρόγραμμα επεξεργασίας
Εισαγωγή στον Παγκόσμιο ιστό και στη γλώσσα Html. Χρ. Ηλιούδης
Εισαγωγή στον Παγκόσμιο ιστό και στη γλώσσα Html Χρ. Ηλιούδης Παγκόσμιος Ιστός (WWW) Ο Παγκόσμιος Ιστός (World Wide Web WWW), ή απλώς Ιστός, βασίζεται στην ιδέα των κατανεμημένων πληροφοριών. Αντί όλες
Πίνακες HTML. Παναγιώτης Γαλάτης 1ο ΕΠΑΛ Ηρακλείου
Πίνακες HTML Παναγιώτης Γαλάτης 1ο ΕΠΑΛ Ηρακλείου Τι είναι Πίνακας Ένας πίνακας στοιχείων αποτελείται από γραμμές και στήλες. Το σημείο τομής μιας γραμμής και μιας στήλης ονομάζεται κελί (cell( cell).
CSS 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 1 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης Creative
Εισαγωγή στην γλώσσα υπερκειμένου HTML
Εισαγωγή στην γλώσσα υπερκειμένου HTML 1 Βασικές έννοιες 2 3 Yπερκείμενο - Υπερσύνδεσμος - HTML Το δομικό χαρακτηριστικό του WWW είναι το υπερκείμενο (hypertext), δηλαδή ένα αρχείο που εκτός από απλό κείμενο
Κεφάλαιο 4 HyperText Markup Language - HTML. Προγραμματιστικά εργαλεία για το διαδίκτυο Φίλιππος Κουτσάκας, Πολύγυρος 2013
Κεφάλαιο 4 HyperText Markup Language - HTML Προγραμματιστικά εργαλεία για το διαδίκτυο Φίλιππος Κουτσάκας, Πολύγυρος 2013 Τι είναι η HTML; Ένας τρόπος για να πεις στον σελιδομετρητή πώς να αναπαραστήσει
Οδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!).
Εργαστήριο #8 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε
Φόρμες. Γενικοί κανόνες. Η ετικέτα <form>
Φόρμες Οι φόρμες περιέχουν τα στοιχεία φόρμας στο οποία ένας χρήστης μπορεί να εισαγάγει δεδομένα τα οποία στη συνέχεια αποστέλλονται σε έναν εξυπηρετητή για παραπέρα επεξεργασία. Γενικοί κανόνες Για τις
Ref.: SLWS 1 5Copyright 2005 The European Computer Driving Licence Foundation Ltd Σελίδα 1 από 7
The European Computer Driving Licence Foundation Ltd Σελίδα 1 από 7 ΣΤΟΧΟΙ ΕΞΕΤΑΣΗΣ Η ενότητα ECDL WebStarter απαιτεί από τον Υποψήφιο να κατανοεί τις κύριες έννοιες της σχεδίασης και δημοσίευσης δικτυακών
2. Επιλέξτε την σωστή ετικέτα HTML που προσφέρει το μεγαλύτερο φόντο κειμένου. <head> <heading> <h6> <h1>
ΤΜΗΜΑ ΗΛΕΚΤΡΟΝΙΚΗΣ Τομέας Υπολογιστικών Συστημάτων και Ελέγχου Τεχνολογίες Πολυμέσων - Εφαρμογές Δρ. Β. ΒΑΛΑΜΟΝΤΕΣ Ε-mail: vala@teiath.gr Να απαντήσετε στις παρακάτω ερωτήσεις. 1. Τι σημαίνουν τα αρχικά
Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML)
Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML) 1. Δημιουργία μιας απλής σελίδας HTML Ανοίξτε το Notepad ακολουθώντας τη διαδρομή Start All Programs Accessories Notepad Πληκτρολογήστε το ακόλουθο κείμενο:
ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ. Κεφάλαιο 5. Αλληλεπιδραστικές ιστοσελίδες (χρήση ετικέτας <FORM> και η τεχνική CGI)
ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ Κεφάλαιο 5. Αλληλεπιδραστικές ιστοσελίδες (χρήση ετικέτας και η τεχνική CGI) Επιμέλεια: Καραγιάννης Σπύρος Καθηγητής ΠΕ19 ΦΟΡΜΕΣ (FORM) Είναι ο κύριος
Σχεδιασμός και Ανάπτυξη Ιστότοπων
Σχεδιασμός και Ανάπτυξη Ιστότοπων CSS: Ιδιότητες μορφοποίησης κειμένου Παρουσίαση 14 η 1 Βελώνης Γεώργιος Καθηγητής Browsers δοκιμών Οι δοκιμές έγιναν στους παρακάτω browsers και εκδόσεις τους: Google
Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης
CASCADING STYLE-SHEETS CASCADING STYLE-SHEETS Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης εφαρµογών HTML. Τα CSS ορίζονται σε δύο συστάσεις του W3C: CSS1, εκ. 1996 περιλαµβάνει περίπου 50 ιδιότητες
<HTML> <HEAD> <TITLE> <BODY>
ΑΣΚΗΣΗ 1 1. Ανοίξτε τον επεξεργαστή ιστοσελίδων 2. Αποθηκεύστε στο X:/mathimata/html/askiseis/ με όνομα askisi1b.html 3. Θα φτιάξουμε μια νέα ιστοσελίδα, χρησιμοποιώντας τις βασικές ετικέτες
ΕΘΝΙΚΟ ΜΕΤΣΟΒΙΟ ΠΟΛΥΤΕΧΝΕΙΟ. Σηµειώσεις για τη γλώσσα HTML (HyperText Markup Language)
ΕΘΝΙΚΟ ΜΕΤΣΟΒΙΟ ΠΟΛΥΤΕΧΝΕΙΟ ΣΧΟΛΗ ΗΛΕΚΤΡΟΛΟΓΩΝ ΜΗΧΑΝΙΚΩΝ ΚΑΙ ΜΗΧΑΝΙΚΩΝ ΥΠΟΛΟΓΙΣΤΩΝ Σηµειώσεις για τη γλώσσα HTML (HyperText Markup Language) ιδάσκων Αν. Καθηγητής Ι.Σ.Βενιέρης Αθήνα, Ιανουάριος 2003 1
Ποιες είναι οι κύριες ετικέτες που χρησιμοποιεί η HTML για την περιγραφή της συνολικής δομής μιας ιστοσελίδας;
Τι είναι η HTML; Η HTML είναι το ακρωνύμιο των λέξεων HyperText Markup Language, δηλαδή Γλώσσα Χαρακτηρισμού Υπερ Κειμένου και βασίζεται στη γλώσσα SGML, Standard Generalized Markup Language, που είναι
1. <body> 2. <header> 3. <h1> My Page </h1> 4. </header> 5. <section>
Ενδεικτικές ερωτήσεις 1. Τι σημαίνουν τα αρχικά CSS 2. Τι σημαίνουν τα αρχικά HTML 3. Ποια η διαφορά μεταξύ Internet και Web; a. Είναι το ίδιο b. Το Web είναι μια υπηρεσία του διαδικτύου 4. Ποια η διαφορά
Προγραμματισμός Διαδικτύου ΕΡΓΑΣΤΗΡΙΟ. Τμ. ΔΕ- Χειμ
Προγραμματισμός Διαδικτύου ΕΡΓΑΣΤΗΡΙΟ Τμ. ΔΕ- Χειμ. 2014-15 Ετικέτες meta 2 Δε περιέχουν περιεχόμενο Έχουν 2 ιδιότητες. content: (υποχρεωτικό): Τα ίδια τα μετα-δεδομένα name: Συνήθως author, keywords και
Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή.
Εισαγωγή στο CSS Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή. Πλεονεκτήματα CSS έναντι χρήσης μόνο HTML Μεγαλύτερη ευελιξία μορφοποιήσεων. Το CSS κατέστησε
ΗTML και XHTML Βασικές. Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας
ΗTML και XHTML Βασικές έννοιες Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας Η γραμματική της ΗΤML Όπως κάθε γλώσσα έχει μια γραμματική
Άσκηση 3 -Δηµιουργία ιστοσελίδων µε HTML µέρος 3 ο
Άσκηση 3 -Δηµιουργία ιστοσελίδων µε HTML µέρος 3 ο Εικόνες στην HTML Oι εικόνες ορίζονται µε την ετικέτα . Η συγκεκριµένη ετικέτα δεν κλείνει (είναι λάθος το: ) ή µπορούµε να πούµε ότι ανοίγει
Βασικά στοιχεία του CSS
Βασικά στοιχεία του CSS Περιεχόμενα Τι είναι CSS Πλεονεκτήματα CSS μορφοποίησης Συντακτικό του CSS Ιδιότητες CSS Εφαρμογή CSS κανόνων Επικάλυψη CSS κανόνων 2 Μορφοποίηση με HTML Η HTML είναι σχεδιασμένη
Europe Code Week 7-22 Οκτωβρίου Μία γιορτή δημιουργίας με κώδικα
Europe Code Week 7-22 Οκτωβρίου 2017 7-22 October 2017 Μία γιορτή δημιουργίας με κώδικα @CodeWeekEU #codeeu codeeu Εισαγωγή στο Web Development CSS Λίγα λόγια... Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
Cascading Style Sheets
Cascading Style Sheets CSS είναι το ακρωνύµιο του Cascading Style Sheets (Επικαλυπτόµενα φύλλα στυλ). CSS είναι µια γλώσσα style δηλ. µια γλώσσα η οποία καθορίζει τη εµφάνιση HTML εγγράφων. Για παράδειγµα,
Η ΓΛΩΣΣΑ ΕΠΙΚΑΛΥΠΤΩΜΕΝΩΝ ΜΟΡΦΟΠΟΙΗΣΕΩΝ CSS
Η ΓΛΩΣΣΑ ΕΠΙΚΑΛΥΠΤΩΜΕΝΩΝ ΜΟΡΦΟΠΟΙΗΣΕΩΝ CSS Πίνακες Ιδιοτήτων Μορφοποίησης CSS Ιδιότητες Διαστασιολόγησης Στοιχείων height Ορίζει το ύψος ενός στοιχείου auto lenght (px) line-height Ορίζει το ύφος μιας
Νέες Τεχνολογίες στην Εκπαίδευση
Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Πλαίσια Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται
ΕΡΓΑΣΤΗΡΙΑΚΗ ΑΣΚΗΣΗ 2 ΜΕΛΕΤΗ ΚΑΙ ΕΦΑΡΜΟΓΗ ΔΗΜΙΟΥΡΓΙΑΣ HTML ΣΕΛΙΔΩΝ ΣΥΝΔΕΣΜΟΙ
ΕΡΓΑΣΤΗΡΙΑΚΗ ΑΣΚΗΣΗ 2 ΜΕΛΕΤΗ ΚΑΙ ΕΦΑΡΜΟΓΗ ΔΗΜΙΟΥΡΓΙΑΣ HTML ΣΕΛΙΔΩΝ ΣΥΝΔΕΣΜΟΙ Στην άσκηση αυτή θα εμπλουτίσουμε την ιστοσελίδα που φτιάξαμε στην προηγούμενη άκηση με πίνακες, συνδέσμους και γραφικά. 1.
Νέες Τεχνολογίες στην Εκπαίδευση
Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Μορφοποίηση κειμένου Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης Το παρόν εκπαιδευτικό
TEC510 Ανάπτυξη Δικτυακών Τόπων (Ε εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Γιώργος Μηλιώτης
TEC510 Ανάπτυξη Δικτυακών Τόπων (Ε εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Γιώργος Μηλιώτης Χειμερινό εξάμηνο 2011-2012 Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό
ΕΠΛ 003: ΕΠΙΣΤΗΜΗ ΤΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΚΑΙ ΠΛΗΡΟΦΟΡΙΑΚΑ ΣΥΣΤΗΜΑΤΑ HTML
ΕΠΛ 003: ΕΠΙΣΤΗΜΗ ΤΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΚΑΙ ΠΛΗΡΟΦΟΡΙΑΚΑ ΣΥΣΤΗΜΑΤΑ HTML Στόχοι 1 Να δημιουργήσουμε υπερκείμενα με την Γλώσσα Επισημείωσης Υπερκειμένων (hypertext markup language, HTML). Υπολογιστικά συστήματα:
Μάθηµα 3 Περ ε ισ ι σότ ό ε τ ρ ε α α γ ια ι α τ η τ η γ λώσ ώ σα α HTML
Μάθηµα 3 Περισσότερα για τη γλώσσα Περισσότερα για τη γλώσσα HTML Περιεχόµενα Επικεφαλίδες (Headings) Παράγραφοι Λίστες Μορφοποίηση κειµένου Σύνδεσµοι Επικεφαλίδες (Headings) Οι επικεφαλίδες επιτελούν
Βασίλειος Κοντογιάννης ΠΕ19
Ενότητα3 Επικοινωνία και Διαδίκτυο 11.1 Γενική Εισαγωγή στην HTML Τι είναι η HTML (HyperText Markup Language); Είναι μια γλώσσα σήμανσης (Markup) με την οποία πραγματοποιείται η δόμηση σελίδων του Παγκόσμιου
Βαρβάκειο Πρότυπο Γυμνάσιο
Παραδόσεις & εργαστηριακές ασκήσεις στην HTML Βαρβάκειο Πρότυπο Γυμνάσιο Σχολ. Χρονιά 2016-2017 Θ. Οτζάκογλου Εργαστήρι Πληροφορικής Σχολ. Έτος 2016 2017 Αν και δεν είναι μία ακόμη «γλώσσα προγραμματισμού»,
Υπερσυνδέσεις (hyperlinks)
Υπερσυνδέσεις (hyperlinks) Οι υπερσυνδέσεις αποτελούν το δυναμικό στοιχείο σε ένα έγγραφο html. Με τις υπερσυνδέσεις είναι δυνατή, εύκολη και γρήγορη η μετάβαση ή η παραπομπή από ένα αρχείο html (πηγή)
Σχεδίαση ιστοσελίδων με τη γλώσσα HTML
Τ.Ε.Ι. Δυτικής Ελλάδας Σχολή Διοίκησης και Οικονομίας Τμήμα Διοίκησης Επιχειρήσεων - Πάτρα Σχεδίαση ιστοσελίδων με τη γλώσσα HTML Γιάννης Κουτσονίκος Σημειώσεις για το Εργαστήριο «Επιχειρηματικές δικτυακές
Cascading Style Sheets Φόρμες (Forms)
Cascading Style Sheets Φόρμες (Forms) Πανεπιστήμιο Πελοποννήσου Τμήμα Επιστήμης & Τεχνολογίας Τηλεπικοινωνιών Ευάγγελος Α. Κοσμάτος Cascading Style Sheets Τα Cascading Style Sheets (CSS) είναι οδηγίες
Περιεχόμενα. Γαβαλάς Δαμιανός
Δικτυακά Πολυμέσα ΙΙ Διάλεξη #5 η : Τυπογραφία στο web Γαβαλάς Δαμιανός dgavalas@aegean.gr Περιεχόμενα Κατανόηση αρχών σχεδιασμού με γραμματοσειρές Κατανόηση των μονάδων μέτρησης που χρησιμοποιούνται στα
Η λίστα <ol> (ordered list)
Λίστες (lists) Σε πολλά έγγραφα απαιτείται η παρουσίαση ή η καταγραφή στοιχείων σε μορφή λίστας. Για παράδειγμα, μια λίστα από ονόματα ή μια λίστα από προϊόντα. Τα στοιχεία μιας λίστας μπορεί να είναι
Σχεδίαση ιστοσελίδων
Τ.Ε.Ι. Δυτικής Ελλάδας Σχολή Διοίκησης και Οικονομίας Τμήμα Διοίκησης Επιχειρήσεων - Πάτρα Σχεδίαση ιστοσελίδων Θεώνη Πιτουρά, Γιάννης Κουτσονίκος Σημειώσεις για το Εργαστήριο «Επιχειρηματικές δικτυακές
Προγραμματισμός Παγκόσμιου Ιστού
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Προγραμματισμός Παγκόσμιου Ιστού 2 η Διάλεξη Δημοσθένης Κυριαζής Δευτέρα 6 Μαρτίου 2017 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης HTML / HTML5 Λίστες,
ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΣΧΟΛΙΚΟ ΒΙΒΛΙΟ ΚΕΦΑΛΑΙΟ 11 Ευάγγελος Χ. Ζιούλας (Καθηγητής Πληροφορικής)
http://www.zioulas.gr ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΣΧΟΛΙΚΟ ΒΙΒΛΙΟ ΚΕΦΑΛΑΙΟ 11 Ευάγγελος Χ. Ζιούλας (Καθηγητής Πληροφορικής) WEB SERVER Είναι μια εφαρμογή software που αναλαμβάνει την αποστολή μιας ιστοσελίδας σε
Εξεταστέα Ύλη (Syllabus) Έκδοση 1.5
Εξεταστέα Ύλη (Syllabus) Έκδοση 1.5 Πνευματικά Δικαιώματα 2005 Ίδρυμα ECDL (ECDL Foundation www.ecdl.com) Όλα τα δικαιώματα είναι κατοχυρωμένα. Κανένα μέρος αυτού του εγγράφου δεν μπορεί να αναπαραχθεί
HTML 2. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
HTML 2 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης
Βαρβάκειο Πρότυπο Γυμνάσιο
Παραδόσεις & εργαστηριακές ασκήσεις στην HTML Βαρβάκειο Πρότυπο Γυμνάσιο Σχολ. Χρονιά 2017-2018 Θ. Οτζάκογλου Εργαστήρι Πληροφορικής Σχολ. Έτος 2016 2017 Αν και δεν είναι μία ακόμη «γλώσσα προγραμματισμού»,
Σπουδές CAD, Πληροφορικής, Οικονομίας, Διοίκησης και D.T.P. με Σύστημα διδασκαλίας facetoface
Copyright 2009-2012 -SYSTEM- All rights reserved 2/159 ΠΕΡΙΕΧΟΜΕΝΑ Μάθημα 1: New - Save Μάθημα 2: Εισαγωγή στη CSS Μάθημα 3: Τρόπος Σύνταξης Μάθημα 4: Σχόλια Μάθημα 5: ID Μάθημα 6: Class Μάθημα 7: Background
Κεφάλαιο 11: Εισαγωγή στην HTML. Εφαρμογές Πληροφορικής Κεφ. 11 Καραμαούνας Πολύκαρπος
Κεφάλαιο 11: Εισαγωγή στην HTML 1 11.1 Γενική εισαγωγή στην HTML Τι είναι η HTML HyperText Markup Language - Γλώσσα Χαρακτηρισμού Υπερ-Κειμένου είναι η βασική γλώσσα με την οποία πραγματοποιείται η δόμηση
Θέματα Προγραμματισμού Διαδικτύου ~ CSS ~
Θέματα Προγραμματισμού Διαδικτύου ~ CSS ~ Στελιος Σφακιανάκης Εαρινό 2019 Αυτή η εργασία χορηγείται με άδεια Creative Commons Αναφορά Δημιουργού - Μη Εμπορική Χρήση - Παρόμοια Διανομή 1 Εισαγωγή στο CSS
Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας
Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας ικτυακά Πολυμέσα Ι (Β Έτος, 3ο εξ) ιάλεξη #6η: HTML: ετικέτες ΜΕΤΑ, Cascading Style Sheet (CSS) Γαβαλάς Δαμιανός
Τεχνολογίες Διαδικτύου - Εργαστήριο 1 ο
Τεχνολογίες Διαδικτύου - Εργαστήριο 1 ο 1. Δημιουργία μιας απλής σελίδας HTML Στον προσωπικό σας κατάλογο δημιουργήστε ένα φάκελο με όνομα HTML. Ανοίξτε το Notepad ακολουθώντας τη διαδρομή (Start All Programs
CSS. Εισαγωγή & Βασικές έννοιες. Cascading Style Sheets. Επικαλυπτόμενα φύλλα στυλ
CSS Εισαγωγή & Βασικές έννοιες Cascading Style Sheets Επικαλυπτόμενα φύλλα στυλ Περιεχόμενα Τι είναι CSS Πλεονεκτήματα CSS μορφοποίησης Συντακτικό του CSS Ιδιότητες CSS Εφαρμογή CSS κανόνων Επικάλυψη CSS
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
CTEC-153: ΥΠΟΛΟΓΙΣΤΙΚΑ ΦΥΛΛΑ
ΜΑΘΗΜΑ 5 ΣΤΟΧΟΙ: 1. Μορφοποίηση Αριθμών 2. Αλλαγή Μεγέθους Και Τύπου Γραμματοσειράς 3. Χρησιμοποίηση Πλάγιων, Έντονων, Υπογραμμισμένων Χαρακτήρων 4. Αλλαγή Χρώματος Γραμματοσειράς 5. Παράθυρο Διαλόγου
ΚΕΦΑΛΑΙΟ 4. H Γλώσσα Σήµανσης HTML. - Απρίλιος ηµήτριος Σάµψων. Επίκουρος Καθηγητής
ΠΑΝΕΠΙΣΤΗΜΙΟ ΠΕΙΡΑΙΩΣ Τµήµα ιδακτικής της Τεχνολογίας και Ψηφιακών Συστηµάτων ΚΕΦΑΛΑΙΟ 4 H Γλώσσα Σήµανσης HTML ηµήτριος Σάµψων Επίκουρος Καθηγητής - Απρίλιος 2004 - Περιεχόµενα 4 Η Γλώσσα Σήµανσης HTML...
CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML
CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML Εισαγωγή Το CSS (Cascading Style Sheets ή Επικαλυπτόμενα Φύλλα Στυλ) μας επιτρέπει να αλλάξουμε τον τρόπο με τον οποίο παρουσιάζονται τα στοιχεία
Σχεδιασμός και Ανάπτυξη Ιστοτόπων. ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος
Σχεδιασμός και Ανάπτυξη Ιστοτόπων ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος H γλώσσα HTML Άλλες Βιβλιογραφικές πηγές για HTML http://www.w3schools.com/html/ http://www.it.uom.gr/project/html2/lessons.html
Η Βίβλος των CSS. Εισαγωγή στα CSS
Η Βίβλος των CSS Εισαγωγή στα CSS Τα Διαδοχικά Φύλλα Στυλ (CSS, Cascading Style Sheets) αποτελούν ένα πολύ καλό εργαλείο για να μπορούμε να αλλάζουμε την εμφάνιση και τη διάταξη (layout) των ιστοσελίδων
Νέες Τεχνολογίες στην Εκπαίδευση
Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Πίνακες Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται
Εργαλεία ανάπτυξης εφαρμογών internet Ι
IEK ΟΑΕΔ ΚΑΛΑΜΑΤΑΣ ΤΕΧΝΙΚΟΣ ΕΦΑΡΜΟΓΩΝ ΠΛΗΟΦΟΡΙΚΗΣ Εργαλεία ανάπτυξης εφαρμογών internet Ι HTML Διδάσκουσα: Κανελλοπούλου Χριστίνα ΠΕ19 Πληροφορικής HTML (HyperText Markup Language) Η γλώσσα που χρησιμοποιείται
ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 4o ΕΡΓΑΣΤΗΡΙΟ ΕΙΚΟΝΕΣ ΣΤΗΝ HTML
ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ ΠΕΡΙΕΧΟΜΕΝΟ ΜΑΘΗΜΑΤΟΣ 1. Εικόνες 2. Ασκήσεις 4o ΕΡΓΑΣΤΗΡΙΟ ΕΙΚΟΝΕΣ ΣΤΗΝ HTML 1. Εικόνες 1. Οι μορφές (format) των εικόνων που μπορείτε
7-22 Οκτωβρίου Μία γιορτή δημιουργίας με κώδικα. Europe Code Week
7-22 Οκτωβρίου 2017 Μία γιορτή δημιουργίας με κώδικα @ #codeeu codeeu 7-22 October 2017 Europe Code Week Εισαγωγή στο Web Development HTML Λίγα λόγια... Η HTML είναι η βασική γλώσσα γραφής των ιστοσελίδων!
CSS 2. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος. Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 2 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης
1. Κλικ στην καρτέλα Insert 2. Tables 3. Κλικ Table 4. Σύρουμε το δείκτη του ποντικιού και επιλέγουμε τον επιθυμητό αριθμό γραμμών και στηλών
ΜΑΘΗΜΑ 4 ΣΤΟΧΟΙ: 1. Προσθήκη Πίνακα (Table) 2. Εισαγωγή Και Μετακίνηση Κειμένου Σε Πίνακα 3. Εισαγωγή Στηλών Και Γραμμών Σε Πίνακα 4. Διαγραφή Στηλών Και Γραμμών Σε Πίνακα 5. Αλλαγή Πλάτους Στηλών Και
Η Βίβλος των CSS - Μέρος 3 Το Box Model, τα Περιθώρια και τα Περιγράμματα
Η Βίβλος των CSS - Μέρος 3 Το Box Model, τα Περιθώρια και τα Περιγράμματα Το Box Model Το box model στα CSS περιγράφει τα πλαίσια (boxes) που δημιουργούνται για τα στοιχεία (elements) της HTML. Το box