Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή.
|
|
|
- Ἀριστόβουλος Ελευθερίου
- 7 χρόνια πριν
- Προβολές:
Transcript
1 Εισαγωγή στο CSS Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή. Πλεονεκτήματα CSS έναντι χρήσης μόνο HTML Μεγαλύτερη ευελιξία μορφοποιήσεων. Το CSS κατέστησε εφικτές μορφοποιήσεις οι οποίες ήταν αδύνατες ή πολύ δύσκολες με την κλασσική HTML. Ευκολότερη συντήρηση των ιστοσελίδων. Η εμφάνιση ενός ολόκληρου site μπορεί να ελέγχεται από ένα μόνο εξωτερικό αρχείο CSS. Έτσι, κάθε αλλαγή στο στυλ της ιστοσελίδας μπορεί να γίνεται με μια μοναδική αλλαγή σε αυτό το αρχείο, αντί για την επεξεργασία πολλών σημείων σε κάθε σελίδα που υπάρχει στο site. Μικρότερο μέγεθος αρχείου, δεδομένου ότι ο κάθε κανόνας μορφοποίησης γράφεται μόνο μια φορά και όχι σε κάθε σημείο που εφαρμόζεται. Καλύτερο SEO (Search engine optimization). Οι μηχανές αναζήτησης δεν «μπερδεύονται» ανάμεσα σε περιεχόμενο και τη μορφοποίηση του, αλλά έχουν πρόσβαση στο περιεχόμενο σκέτο, οπότε είναι πολύ ευκολότερο να το καταγράψουν και να το αρχειοθετήσουν (indexing). Γρηγορότερες σελίδες. Όταν χρησιμοποιούμε εξωτερικό αρχείο CSS, ο browser την πρώτη φορά που θα φορτώσει κάποια σελίδα του site μας το αποθηκεύει στην cache, οπότε δεν χρειάζεται να το κατεβάσει ξανά κάθε φορά που κατεβάζει ο χρήστης του κάποια άλλη σελίδα του site μας. Κανόνες CSS Ένας «κανόνας» CSS αποτελείται από 2 μέρη: Τον επιλογέα (CSS selector) ο οποίος αφορά το ΤΙ θα μορφοποιηθεί και τις ιδιότητες (CSS properties) οι οποίες αφορούν το ΠΩΣ αυτό θα μορφοποιηθεί. Η σύνταξη είναι η εξής: επιλογέας { ιδιότητα_1: τιμή_1; ιδιότητα_2: τιμή_2; ιδιότητα_3: τιμή_3; επιλογέας είναι τα στοιχεία που θα επιλεχτούν, ιδιότητα είναι ποια χαρακτηριστικά θα οριστούν, τιμή είναι οι τιμές που θα ρυθμιστούν. Βασικές σημειώσεις CSS 0
2 Μπορείτε να δείτε ένα μικρό παράδειγμα CSS παρακάτω: Κώδικας <html> <head> <title> CSS</title> Καλώς ήλθατε στο CSS <style type="text/css"> body { background color: lightblue; font family: Arial; font size: 16px; font style: italic; </style> </head> <body> Καλώς ήλθατε στο CSS </body> </html> Εισαγωγή κώδικα CSS σε μία σελίδα HTML Υπάρχουν 3 τρόποι με τους οποίους μπορούμε να εισάγουμε κώδικα CSS στην σελίδα μας. 1ος τρόπος: Μπορούμε να εισάγουμε τον κώδικα CSS απευθείας στο αρχείο HTML. Στην κεφαλίδα < head > του αρχείου HTML, εισάγουμε την ετικέτα style και ορίζουμε τον χαρακτηριστικό type σε text/css. <style type="text/css"> κώδικας CSS </style> <html> <head> <title> CSS</title> <style type="text/css"> body { font family: Arial; font size: 16px; font style: italic; </style> </head> <body> Καλώς ήλθατε στο CSS </body> </html> Καλώς ήλθατε στο CSS Βασικές σημειώσεις CSS 1
3 2ος τρόπος: Περιλαμβάνουμε ένα εξωτερικό αρχείο CSS, στην κεφαλή ( head ) της ιστοσελίδας μας: <link rel="stylesheet" href="/example/style.css" type="text/css" /> rel : Ορίζει τον τύπο της ένταξης. href : Ορίζει το αρχείο που θα συμπεριλάβουμε. Στην περίπτωσή μας το αρχείο style.css από τον κατάλογο example της ιστοσελίδας μας. type : Ορίζει τον τύπο του συνδέσμου. Για stylesheets αυτό είναι text/css. Κώδικας HTML <html> <head> <title> CSS</title> <link rel="stylesheet" href="style.css" type="text/css"/> </head> <body> Καλώς ήλθατε στο CSS </body> </html> Καλώς ήλθατε στο CSS Κώδικας αρχείου mystyle.css font family: Arial; font size: 16px; font style: italic; 3ος τρόπος Inline CSS: Αν επιθυμούμε να μορφοποιήσουμε ένα στοιχείο μόνο, και δεν πρόκειται να χρειαστούμε αυτό το είδος μορφοποίησης για τίποτε άλλο στο site, μπορούμε να γράψουμε ιδιότητες CSS στην ιδιότητα style, την οποία διαθέτει σχεδόν κάθε στοιχείο της HTML. Πχ για να κάνουμε μια συγκεκριμένη παράγραφο κόκκινη, μπορούμε να γράψουμε: <p style= color:red; > Βασικές σημειώσεις CSS 2
4 Επιλογείς Με τους επιλογείς μπορούμε να βρίσκουμε τα στοιχεία της ιστοσελίδας για τα οποία ενδιαφερόμαστε να αλλάξουμε τη μορφή. Υπάρχουν διάφοροι τύποι επιλογέα. Επιλογείς ετικέτας Η μορφοποίηση αφορά όλα τα στοιχεία της ιστοσελίδας με ίδια ετικέτα. body { font family : 'Times New Roman'; font size : 20px; background color : black ; color : white; Επεξήγηση 1. Βρες την ετικέτα body 2. Ρύθμισε γραμματοσειρά σε Times New Roman 3. Όρισε το μέγεθος γραμματοσειράς σε 20 pixels 4. Όρισε χρώμα φόντου το μαύρο(black) 5. Όρισε χρώμα γραμματοσειράς το άσπρο(white) Επιλογείς αναγνωριστικού # Αυτοί οι επιλογείς αναζητούν στοιχεία των οποίων τα χαρακτηριστικά ταιριάζουν με τις τιμές του id τους. Σημείωση : Σε ένα έγγραφο HTML δεν μπορούν να υπάρχουν δύο ίδια id. Κάθε id διευκρινίζει μια μοναδική τιμή για ένα στοιχείο HTML. Έχουμε 3 παραγράφους, κάθε μία με διαφορετική τιμή id. <p id="par1">παράγραφος 1</p> <p id="par2">παράγραφος 2</p> <p id="par3">παράγραφος 3</p> Χρησιμοποιώντας επιλογείς αναγνωριστικού μπορούμε να επιλέξουμε ένα μοναδικό από αυτά τα στοιχεία επιλέγοντας το id του. Η σύνταξη του επιλογέα είναι η ίδια με του επιλογέα ετικέτας, με τη μόνη διαφορά ότι ο χαρακτήρας δίεση (#) προστίθεται ως πρόθεμα. # par3 { font size : 24px; Παράγραφος 1 Παράγραφος 2 Παράγραφος 3 Βασικές σημειώσεις CSS 3
5 Επιλογείς κλάσης. To χαρακτηριστικό class μπορεί να εφαρμοστεί σχεδόν σε όλα τα στοιχεία της HTML. Με αυτό τον τρόπο είναι πιο εύκολο να μορφοποιήσουμε ένα σύνολο στοιχείων από κάθε στοιχείο ξεχωριστά. Η σύνταξη του επιλογέα είναι παρόμοια με τη σύνταξη ενός επιλογέα αναγνωριστικού, μόνο που αντί να χρησιμοποιούμε το χαρακτήρα δίεση (#) χρησιμοποιούμε την τελεία (. ). Έχουμε τις παρακάτω 4 παραγράφους: <p class="entona">αυτό είναι σε έντονη γραφή</p> <p class="plagia">αυτό είναι σε πλάγια γραφή</p> <p class="entona">αυτό είναι σε έντονη γραφή</p> <p class="plagia">αυτό είναι σε πλάγια γραφή</p> Θέλουμε η κλάση entona να μορφοποιηθεί με έντονη γραμματοσειρά και η plagia με πλάγια γραμματοσειρά..entona { font weight : bold;.plagia { font style : italic; Αυτό είναι σε έντονη γραφή Αυτό είναι σε πλάγια γραφή Αυτό είναι σε έντονη γραφή Αυτό είναι σε πλάγια γραφή Καθολικός επιλογέας * Όταν ο επιλογέας είναι ένας χαρακτήρας αστερίσκου, τότε οι ιδιότητες που θα γράψουμε σε αυτόν τον κανόνα CSS εφαρμόζονται σε κάθε στοιχείο της σελίδας μας. Όπως είναι κατανοητό, συνήθως δεν είναι και πολύ χρήσιμος επιλογέας από μόνος του, και χρησιμοποιείται κυρίως σε συνδυασμό με άλλους. Σύνθετοι επιλογείς CSS (CSS selectors) Πολλές φορές μπορούμε να συνδυάσουμε σε έναν επιλογέα περισσότερους από έναν υπό επιλογείς, βάσει συγκεκριμένων κανόνων σύνταξης, κάτι που μας προσφέρει μεγαλύτερη ευελιξία και εξοικονόμηση χρόνου. Οι πιο βασικοί και συχνά χρησιμοποιούμενοι τρόποι συνδυασμού επιλογέων παρουσιάζονται παρακάτω: επιλογέας1, επιλογέας2, επιλογέας3, κτλ Οι ιδιότητες που θα γράψουμε σε αυτόν τον κανόνα CSS, θα εφαρμοστούν σε κάθε στοιχείο που πληροί τις προϋποθέσεις επιλογής είτε για τον επιλογέα1, είτε για τον επιλογέα2, είτε για τον επιλογέα3 κτλ. επιλογέας1 επιλογέας2 επιλογέας3... επιλογέαςn Οι ιδιότητες που θα γράψουμε σε αυτόν τον κανόνα CSS θα εφαρμοστούν σε στοιχεία που πληρούν τις προϋποθέσεις του επιλογέα n και επιπροσθέτως περιέχονται μέσα σε κάποιο στοιχείο που πληροί τις προϋποθέσεις του επιλογέα n 1 το οποίο βρίσκεται μέσα σε κάποιο στοιχείο που πληροί τις προϋποθέσεις του επιλογέα n 2 κοκ. Παραδείγματος χάριν ο επιλογέας p img θα εφαρμοστεί σε όσες εικόνες περιέχονται μέσα σε tags <p>...</p>. Βασικές σημειώσεις CSS 4
6 Χρήση CSS: Μορφοποίηση κειμένου Γραμματοσειρά Η ιδιότητα που καθορίζει τη γραμματοσειρά είναι η font family. Παραδείγματα: Κώδικας HTML <p class="para">αυτό είναι σε Arial</p> <p class="parb">αυτό είναι σε Times New Roman</p> Αυτό είναι σε Arial Αυτό είναι σε Times New Roman para { font family: Arial; parb { font family: Times New Roman ; Ο υπολογιστής μπορεί να χρησιμοποιήσει γραμματοσειρές που είναι ήδη εγκατεστημένες στο σύστημα (εξαίρεση η χρήση Google Fonts με το αντίστοιχο Javascript αρχείο). Οι παρακάτω γραμματοσειρές θεωρούνται ασφαλείς για χρήση και εμφάνιση σε οποιοδήποτε λειτουργικό σύστημα: Arial Comic Sans MS Courier New Impact Lucida Console Tahoma Times New Roman Verdana Μέγεθος γραμματοσειράς: Ιδιότητα font size Το μέγεθος μπορεί να καθοριστεί με διαφόρους τρόπους: σε pixels(px) σε σημεία (1pt = 1/72 της ίντσας) σε πλάτος έντυπου υλικού (1em = τρέχον μέγεθος γραμματοσειράς, 2em = διπλασιασμός μεγέθους κτλ) σε ποσοστό (100% = τρέχον μέγεθος γραμματοσειράς, 200% = διπλασιασμός μεγέθους κτλ) Βασικές σημειώσεις CSS 5
7 Κώδικας HTML <p class="para">αυτό είναι σε Arial 12px</p> <p class="parb">αυτό είναι σε Arial 12pt</p> <p class="parc">αυτό είναι σε Arial 12em</p> <p class="pard">αυτό είναι σε Arial 80%</p> para { font family: Arial; font size: 12px; parb { font family: Arial; font size: 14pt; parc { font family: Arial; font size: 2em; pard { font family: Arial; font size: 80%; Αυτό είναι σε Arial 12px Αυτό είναι σε Arial 14pt Αυτό είναι σε Arial 2em Αυτό είναι σε Arial 80% Χρώμα γραμματοσειράς: ιδιότητα color Το χρώμα μπορεί να καθοριστεί με διαφόρους τρόπους: Ονομασία χρώματος (red, green, blue κτλ) Δεκαεξαδικές τιμές (#ff0000 = κόκκινο κτλ) Τιμές RGB (255, 0, 0 = κόκκινο κτλ) Κώδικας HTML <p class="para">αυτό είναι χρώμα blue</p> <p class="parb">αυτό είναι χρώμα #0000ff </p> <p class="parc">αυτό είναι χρώμα rgb(0, 0, 255) </p> para { color: blue; parb { color: #0000ff; parc { color: rgb(0,0,255); Αυτό είναι χρώμα blue Αυτό είναι χρώμα #0000ff Αυτό είναι χρώμα rgb(0, 0, 255) Σημείωση: όλα τα παραπάνω εμφανίζονται μπλε Βασικές σημειώσεις CSS 6
8 Έντονα - Πλάγια - Υπογραμμισμένα: Ιδιότητες font weight, font style, text decoration Κώδικας HTML <p class="para">αυτό είναι έντονα</p> <p class="parb">αυτό είναι πλάγια</p> <p class="parc">αυτό είναι υπογραμμισμένα </p> Αυτό είναι έντονα Αυτό είναι πλάγια Αυτό είναι υπογραμμισμένα para { font weight: bold; parb { font style: italic; parc { text decoration: underline; Ευθυγράμμιση κειμένου: ιδιότητα text align Εξ ορισμού στην HTML όλο το κείμενο είναι στοιχισμένο αριστερά. Η τιμή αυτής της ιδιότητας μπορεί να είναι μία από τις ακόλουθες: left, right, center, justify. p { text align: right; Χρώμα φόντου: Ιδιότητα background color Οι τιμές της μπορούν να είναι είτε σε (#ff0000), σε RGB (rgb(255, 0, 0)) ή το όνομα του χρώματος (red). p { background color: yellow; Βασικές σημειώσεις CSS 7
9 Στοιχεία Έχουμε 2 ειδών στοιχεία: block και inline. Μέγεθος στοιχείου: Ιδιότητες width, height Σε ένα στοιχείο block μπορούμε να ρυθμίσουμε τις διαστάσεις του ενώ σε ένα στοιχείο inline όχι. Κώδικας HTML <div class="box"></div>.box { background color: yellow; width: 60px; height: 60px; Περιγράμματα στοιχείου: ιδιότητα border Η ιδιότητα border δέχεται τις εξής παραμέτρους: border width:το πλάτος του περιγράμματος σε εικονοστοιχεία (pixels). border style: Το στυλ του περιγράμματος (solid, dashed, dotted, double, groove, ridge, inset και outset). border color: Το χρώμα του περιγράμματος..my border { border: 3px solid blue; Εξωτερικά περιθώρια στοιχείου: ιδιότητα margin Ένα περιθώριο είναι η απόσταση ενός στοιχείου από άλλα στοιχεία. Τα περιθώρια ρυθμίζονται με τη φορά του ρολογιού. Η πρώτη τιμή προσδιορίζει το επάνω περιθώριο. Η δεύτερη τιμή το δεξί περιθώριο. Η τρίτη τιμή το κάτω περιθώριο και η τελευταία το αριστερό..green box { margin: 10px 0px 20px 30px; Στο παράδειγμά μας έχουμε 4 τιμές. Το στοιχείο έχει απόσταση 10 pixel από την κορυφή, 30 pixel από αριστερά και 20 pixel από κάτω. Βασικές σημειώσεις CSS 8
10 Εσωτερικά περιθώρια στοιχείου: ιδιότητα padding Ένα εσωτερικό περιθώριο ορίζει την απόσταση μιας πλευράς του στοιχείου από τα περιεχόμενά του. Τα εσωτερικά περιθώρια ρυθμίζονται με τη φορά του ρολογιού. Η πρώτη τιμή προσδιορίζει το επάνω περιθώριο. Η δεύτερη τιμή το δεξί περιθώριο. Η τρίτη τιμή το κάτω περιθώριο και η τελευταία το αριστερό..green box { padding: 8px 8px 8px 8px; Στο παράδειγμά μας έχουμε 4 τιμές. Το στοιχείο έχει απόσταση 8 pixel από τα περιεχόμενά του σε όλες τις πλευρές. Υπερχείλιση στοιχείου: Ιδιότητα overflow Η ιδιότητα overflow μας καθορίζει το αν εμφανίζονται μπάρες κύλισης όταν τα περιεχόμενα ενός στοιχείου δεν χωράνε στο στοιχείο. Η ιδιότητα overflow παίρνει 3 τιμές: visible: Εμφάνιση υπερχείλισης. hidden: Αν υπάρχει υπερχείλιση, είναι κρυμμένη. auto: Αν υπάρχει υπερχείλιση, οι μπάρες κύλισης απεικονίζονται. Αν δεν υπάρχει υπερχείλιση, οι μπάρες είναι κρυμμένες. scroll: Ανεξάρτητα από το αν υπάρχει υπερχείλιση ή όχι, οι μπάρες κύλισης απεικονίζονται. Απλά σε περίπτωση που χρειαστούν. Παράδειγμα.box { overflow: hidden;.box { overflow: scroll; Βασικές σημειώσεις CSS 9
11 Ορατότητα στοιχείου: Ιδιότητες display, visibility H ιδιότητα display μπορεί να πάρει 2 τιμές: none: το στοιχείο είναι αόρατο καθόλου τιμή: το στοιχείο είναι ορατό Ας υποθέσουμε ότι έχουμε τα παρακάτω 3 στοιχεία με διαφορετικό χρώμα (κόκκινο, πράσινο και μπλε).green box { display: none;.green box { display: ; Η ιδιότητα visibility μπορεί να πάρει 2 τιμές: vidible: το στοιχείο είναι ορατό hidden: το στοιχείο είναι αόρατο αλλά καταλαμβάνει το χώρο που του αναλογεί Ας υποθέσουμε ότι έχουμε τα παραπάνω 3 στοιχεία..green box { visibility: hidden;.green box { visibility: visible; Βασικές σημειώσεις CSS 10
12 Απεικόνιση στοιχείου: ιδιότητα display Η ιδιότητα display μας επιτρέπει να αλλάξουμε ένα block στοιχείο σε inline και το αντίστροφο και παίρνει 2 τιμές: block: μετατρέπει ένα στοιχείο σε block inline: μετατρέπει ένα στοιχείο σε inline Ας υποθέσουμε ότι έχουμε 4 στοιχεία div, το ένα κάτω από το άλλο. div { display: inline; Φόντο στοιχείου: ιδιότητα background Η ιδιότητα background εισάγει ένα φόντο στο στοιχείο μας (εικόνα κτλ). Δέχεται 3 παραμέτρους: background color: προσδιορίζει το χρώμα του φόντου. Αν δεν θέλετε κανένα χρώμα, μπορείτε να το ρυθμίσετε σε transparent. image location: Αυτή είναι η τοποθεσία της εικόνας σας. repeat: Μπορούμε να ρυθμίσουμε αν η εικόνα του φόντου θα επαναλαμβάνεται ή όχι. Μπορούμε να χρησιμοποιήσουμε ένα από τα ακόλουθα: no repeat, repeat x, repeat y, repeat. position: Προσδιορίζει τη θέση της εικόνας. Παίρνει δύο τιμές. Η πρώτη ρυθμίζει την οριζόντια κατεύθυνση, για παράδειγμα left ή right. Η δεύτερη ρυθμίζει την κατακόρυφη κατεύθυνση, για παράδειγμα top ή bottom. Παράδειγμα div { background: black url('/images/eikona.png') no repeat left top; Βασικές σημειώσεις CSS 11
13 Σχετική θέση στοιχείου: Ιδιότητα position. Υπάρχει μια ιδιότητα position για κάθε στοιχείο σε ένα αρχείο HTML. Η προκαθορισμένη τιμή γι' αυτήν την ιδιότητα είναι static. Αυτό σημαίνει ότι κάθε στοιχείο θα εμφανίζεται όπως είναι στο αρχείο HTML. Έστω ότι έχουμε τα παρακάτω στοιχεία div το ένα μέσα στο άλλο <div class="big box"> <div class="small box"></div> </div>.small box { position: relative;.small box { position: relative; left: 50px; top: 20px; Το μικρό κουτί εμφανίζεται έξω από το μεγάλο κουτί. Το μικρό κουτί ωστόσο παραμένει μέσα στο μεγάλο κουτί (είναι στοιχείο παιδί). Για να μετακινήσουμε το μικρό κουτί στα αριστερά του μεγάλου, χρησιμοποιούμε μια αρνητική τιμή π.χ. 30px. Βασικές σημειώσεις CSS 12
14 Απόλυτη θέση ενός στοιχείου: Ιδιότητα position #out box { width: 200px; height: 200px; border: 1px solid red; position: relative;.big box { background color: lightblue; width: 100px; height: 100px; margin: 60px 0px 0px 40px;.med box { background color: yellow; width: 70px; height: 70px; margin: 0px 0px 0px 20px;.small box { background color: gray; width: 20px; height: 20px; Με βάση το εξωτερικό κουτί που έχει position:relative γίνονται οι τοποθετήσεις όλων των άλλων κουτιών..small box { background color: red; width: 20px; height: 20px; position: absolute; left: 0px; top: 0px; Το μικρό κουτί τοποθετείται με απόλυτη τιμή 0px σε σχέση με το 1ο γονικό κουτί στη σειρά το οποίο έχει τιμή position διαφορετική από static (δηλ. το κουτί out box γίνεται κουτί αναφοράς)..big box { background color: black; width: 100px; height: 100px; margin: 60px 0px 0px 40px; position: relative;.small box { background color: red; width: 20px; height: 20px; position: absolute; left: 0px; top: 0px; Εδώ το κουτί big box γίνεται το κουτί αναφοράς για το small box επειδή η τιμή position γίνεται relative (διαφορετική από static). Έτσι η θέση του μικρού κουτιού προσδιορίζεται με βάση το big box. Βασικές σημειώσεις CSS 13
15 Ψευδοκλάσεις Οι ψευδοκλάσεις χρησιμοποιούνται για την προσθήκη πρόσθετων εφέ στη σελίδα μας. Ας δούμε μερικές από αυτές: a:link Χρησιμοποιείται αποκλειστικά για στοιχεία a (Δηλαδή ως εξής: a:link) και αφορά τους συνδέσμους που ο χρήστης δεν έχει ακόμη επισκεφθεί. a:visited Επίσης χρησιμοποιείται αποκλειστικά για στοιχεία a (Δηλαδή ως εξής: a:visited) και αφορά τους συνδέσμους που ο χρήστης έχει επισκεφθεί. στοιχείο:active Αφορά τα στοιχεία τύπου <στοιχείο> τη στιγμή που ο χρήστης έχει πατημένο το ποντίκι πάνω σε αυτά. Πχ ο επιλογέας a:active εφαρμόζεται σε συνδέσμους την ώρα που ο χρήστης έχει πατημένο το ποντίκι πάνω τους. στοιχείο:hover Από τις πιο συχνά χρησιμοποιούμενες ψευδό κλάσεις. Αφορά τα στοιχεία τύπου <στοιχείο> τη στιγμή που ο χρήστης έχει το δείκτη του ποντικιού πάνω σε κάποιο από αυτά (χωρίς να πατάει κάποιο πλήκτρο). Μπορεί να μας βοηθήσει να δημιουργήσουμε διάφορα όμορφα εφέ, τα οποία παλιότερα ήταν εφικτά μόνο με javascript. στοιχείο:focus Χρησιμοποιείται κυρίως για στοιχεία φορμών και εφαρμόζεται στα στοιχεία τύπου <στοιχείο> που εκείνη τη στιγμή έχουν «focus», παραδείγματος χάριν, ένα πεδίο κειμένου στο οποίο ο χρήστης έκανε κλικ για να εισάγει κείμενο. στοιχείο:first letter Αφορά το πρώτο γράμμα του κειμένου εντός κάποιου στοιχείου τύπου <στοιχείο>. Το ψευδό στοιχείο αυτό μπορεί να μας βοηθήσει να δημιουργήσουμε αρχιγράμματα. Πχ ο επιλογέας p:first letter αφορά το πρώτο γράμμα κάθε παραγράφου. στοιχείο:first line Ψευδό στοιχείο παρόμοιο με το παραπάνω, μόνο που αντί να αφορά μόνο το πρώτο γράμμα του κειμένου μέσα στο στοιχείο τύπου <στοιχείο>, αφορά ολόκληρη την πρώτη γραμμή. Ένα παράδειγμα ψευδοκλάσης είναι η :hover. Ας δούμε ένα παράδειγμα:.page link { color: blue; text decoration: underline;.page link:hover { font weight: bold; font style: italic; text decoration: none;.. <a class= page link href="#">κεντρική σελίδα</a> Κανονικά: Κεντρική σελίδα Όταν όμως πάμε το ποντίκι πάνω από τον σύνδεσμο: Κεντρική σελίδα Πηγές Μιχαήλια Κομβούτη Βέρου: CSS Notes: Μαθήματα CSS Wlearn: css 83 Μαθήματα CSS Test4U: Βασικές σημειώσεις CSS 14
Cascading Style Sheets (CSS)
Cascading Style Sheets (CSS) Τα Cascading Style Sheets προσφέρουν έναν εύκολο τρόπο για να ορίσουμε τη μορφοποίηση που επιθυμούμε να έχουν οι σελίδες μία τοποθεσίας του Παγκόσμιου Ιστού που δημιουργούμε.
Εργαλεία Ανάπτυξης Εφαρμογών Internet. Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής
Εργαλεία Ανάπτυξης Εφαρμογών Internet Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής Το πρότυπο CSS Α Μέρος 2 CSS (Cascading Style Sheets)(1) Ορίζουν την εμφάνιση των στοιχείων σε ένα έγγραφο HTML.
<a href="http://www.somepage.com/somepage.html">μετάβαση στο κείμενο</a>.
HTML Τα αρχεία της HTML έχουν ετικέτες (tags) που ορίζουν τη δομή και τη μορφοποίηση των ιστοσελίδων. Οι περισσότερες HTML ετικέτες τις συναντούμε ως ζεύγη τα οποία ενεργούν στα περιεχόμενα μεταξύ των
Europe Code Week 7-22 Οκτωβρίου Μία γιορτή δημιουργίας με κώδικα
Europe Code Week 7-22 Οκτωβρίου 2017 7-22 October 2017 Μία γιορτή δημιουργίας με κώδικα @CodeWeekEU #codeeu codeeu Εισαγωγή στο Web Development CSS Λίγα λόγια... Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση
Διάλεξη 2η Εισαγωγή στο CSS
Διάλεξη 2η Εισαγωγή στο CSS Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e c o d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Τι είναι το CSS? Γιατί να χρησιμοποιήσω
CSS 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 1 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης Creative
CSS. Εισαγωγή & Βασικές έννοιες. Cascading Style Sheets. Επικαλυπτόμενα φύλλα στυλ
CSS Εισαγωγή & Βασικές έννοιες Cascading Style Sheets Επικαλυπτόμενα φύλλα στυλ Περιεχόμενα Τι είναι CSS Πλεονεκτήματα CSS μορφοποίησης Συντακτικό του CSS Ιδιότητες CSS Εφαρμογή CSS κανόνων Επικάλυψη CSS
Στην τεχνολογία των CSS, οι κανόνες στυλ (style
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #4 0 : CSS: Βασικές και προχωρημένες τεχνικές επιλογής, τα στοιχεία και , ψευδο κλάσεις και ψευδο επιλογείς Γαβαλάς Δαμιανός dgavalas@aegean.gr 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 προσδιορίζει τη βασική
Η ΓΛΩΣΣΑ ΕΠΙΚΑΛΥΠΤΩΜΕΝΩΝ ΜΟΡΦΟΠΟΙΗΣΕΩΝ CSS
Η ΓΛΩΣΣΑ ΕΠΙΚΑΛΥΠΤΩΜΕΝΩΝ ΜΟΡΦΟΠΟΙΗΣΕΩΝ CSS Πίνακες Ιδιοτήτων Μορφοποίησης CSS Ιδιότητες Διαστασιολόγησης Στοιχείων height Ορίζει το ύψος ενός στοιχείου auto lenght (px) line-height Ορίζει το ύφος μιας
Το απεικονιστικό μοντέλο μορφοποίησης των CSS
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #6 0 : CSS: Χρήση των ιδιοτήτων του κουτιού (box properties). Διάταξη σελίδων Γαβαλάς Δαμιανός dgavalas@aegean.gr Το απεικονιστικό μοντέλο μορφοποίησης των CSS Περιγράφει
Α ΛΥΚΕΙΟΥ - ΕΦΑΡΜΟΓΕΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΜΑΪΟΣ 2019 ΕΝΔΕΙΚΤΙΚΕΣ ΕΡΩΤΗΣΕΙΣ ΚΑΤΑΝΟΗΣΗΣ
Το υλικό αυτό δίνεται στους μαθητές για τη σωστή μελέτη της διδαχθείσας ύλης του μέρους Β. Πρόκειται για ένα συμπαγή κορμό ερωτήσεων και ασκήσεων οι οποίες καλύφθηκαν κατά τη διάρκεια της έως τώρα σχολικής
Βασικά στοιχεία του CSS
Βασικά στοιχεία του CSS Περιεχόμενα Τι είναι CSS Πλεονεκτήματα CSS μορφοποίησης Συντακτικό του CSS Ιδιότητες CSS Εφαρμογή CSS κανόνων Επικάλυψη CSS κανόνων 2 Μορφοποίηση με HTML Η HTML είναι σχεδιασμένη
Θέματα Προγραμματισμού Διαδικτύου ~ CSS ~
Θέματα Προγραμματισμού Διαδικτύου ~ CSS ~ Στελιος Σφακιανάκης Εαρινό 2019 Αυτή η εργασία χορηγείται με άδεια Creative Commons Αναφορά Δημιουργού - Μη Εμπορική Χρήση - Παρόμοια Διανομή 1 Εισαγωγή στο CSS
Η Βίβλος των CSS. Εισαγωγή στα CSS
Η Βίβλος των CSS Εισαγωγή στα CSS Τα Διαδοχικά Φύλλα Στυλ (CSS, Cascading Style Sheets) αποτελούν ένα πολύ καλό εργαλείο για να μπορούμε να αλλάζουμε την εμφάνιση και τη διάταξη (layout) των ιστοσελίδων
Ετικέτες HTML. <!-->: Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον
Ετικέτες HTML : Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον πηγαίο κώδικα για να διευκολύνουμε την επεξεργασία και την συντήρηση του αρχείου. Τα σχόλια δεν εμφανίζονται στην οθόνη
Η Βίβλος των CSS - Μέρος 3 Το Box Model, τα Περιθώρια και τα Περιγράμματα
Η Βίβλος των CSS - Μέρος 3 Το Box Model, τα Περιθώρια και τα Περιγράμματα Το Box Model Το box model στα CSS περιγράφει τα πλαίσια (boxes) που δημιουργούνται για τα στοιχεία (elements) της HTML. Το box
3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ
2014 3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ Εισαγωγή Το CSS (Cascading Style Sheets) είναι αρχεία με κατάληξη.css τα οποία καθορίζουν την μορφοποίηση των ιστοσελίδων. Μέσω αυτών επιτυγχάνεται
Σχεδιασμός και Ανάπτυξη Ιστότοπων
Βελώνης Γεώργιος Καθηγητής Σχεδιασμός και Ανάπτυξη Ιστότοπων Εισαγωγή στα CSS (Cascading Style Sheets) Παρουσίαση 13 η 1 Βελώνης Γεώργιος Καθηγητής Περιεχόμενα Εισαγωγή Πλεονεκτήματα χρήσης των CSS Βασικοί
CSS Εργαστήριο 5. Θέση και διάταξη
Display - Επίδειξη CSS Εργαστήριο 5. Θέση και διάταξη Η ιδιότητα display καθορίζει πως και εάν ένα στοιχείο εμφανίζεται στην οθόνη. Τα περισσότερα στοιχεία, εξορισμού είναι είτε block είτε inline. Ένα
CSS 3. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 3 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης
Εισαγωγή στο CSS Από: Μιχαήλια Κομβούτη Βέρου
Εισαγωγή στο CSS Από: Μιχαήλια Κομβούτη Βέρου Τι είναι το CSS (Cascading Style Sheets); To CSS είναι μια απλή γλώσσα που μας βοηθάει να ορίσουμε με σαφήνεια και ιδιαίτερη ευελιξία τον τρόπο με τον οποίο
Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης
CASCADING STYLE-SHEETS CASCADING STYLE-SHEETS Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης εφαρµογών HTML. Τα CSS ορίζονται σε δύο συστάσεις του W3C: CSS1, εκ. 1996 περιλαµβάνει περίπου 50 ιδιότητες
Νέες Τεχνολογίες στην Εκπαίδευση
Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Επάλληλα φύλλα στυλ (CSS): Μια εισαγωγή Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης
Εισαγωγή στο CSS Από: Λία Βέρου
Εισαγωγή στο CSS Από: Λία Βέρου Τι είναι το CSS (Cascading Style Sheets); To CSS είναι μια απλή γλώσσα που μας βοηθάει να ορίσουμε με σαφήνεια και ιδιαίτερη ευελιξία τον τρόπο με τον οποίο θα εμφανίζονται
Περιεχόμενα. Γαβαλάς Δαμιανός
Δικτυακά Πολυμέσα ΙΙ Διάλεξη #5 η : Τυπογραφία στο web Γαβαλάς Δαμιανός dgavalas@aegean.gr Περιεχόμενα Κατανόηση αρχών σχεδιασμού με γραμματοσειρές Κατανόηση των μονάδων μέτρησης που χρησιμοποιούνται στα
Σχεδιασμός και Ανάπτυξη Ιστοσελίδων ΙΙ ΙΕΚ ΤΡΙΑΝΔΡΙΑΣ ΓΡΑΦΙΣΤΑΣ ΕΝΤΥΠΟΥ ΚΑΙ ΗΛΕΚΤΡΟΝΙΚΩΝ ΜΕΣΩΝ. CSS - Cascading Style Sheets
Σχεδιασμός και Ανάπτυξη Ιστοσελίδων ΙΙ ΙΕΚ ΤΡΙΑΝΔΡΙΑΣ ΓΡΑΦΙΣΤΑΣ ΕΝΤΥΠΟΥ ΚΑΙ ΗΛΕΚΤΡΟΝΙΚΩΝ ΜΕΣΩΝ CSS - Cascading Style Sheets Τι είναι τα CSS; Τα CSS (Διαδοχικά Φύλλα Στυλ) αποτελούν ένα πολύ καλό εργαλείο
Εμφάνιση και κρύψιμο στοιχείων
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #8 0 : Δυναμικά εφέ με χρήση CSS Γαβαλάς Δαμιανός dgavalas@aegean.gr Εμφάνιση και κρύψιμο στοιχείων Χρήση της ιδιότητας display με επιτρεπτές τιμές: none: κρύψιμο του στοιχείου
Σχεδιασμός και Ανάπτυξη Ιστότοπων
Σχεδιασμός και Ανάπτυξη Ιστότοπων CSS: Φόντο (background) και Περίγραμμα (border) στοιχείου ιστοσελίδας Παρουσίαση 16 η 1 Βελώνης Γεώργιος Καθηγητής Browsers δοκιμών Οι δοκιμές έγιναν στους παρακάτω browsers
CSS 2. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος. Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 2 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης
Εκπαιδευτικά Περιβάλλοντα Διαδικτύου
ΑΡΙΣΤΟΤΕΛΕΙΟ ΠΑΝΕΠΙΣΤΗΜΙΟ ΘΕΣΣΑΛΟΝΙΚΗΣ ΑΝΟΙΚΤΑ ΑΚΑΔΗΜΑΪΚΑ ΜΑΘΗΜΑΤΑ Εκπαιδευτικά Περιβάλλοντα Διαδικτύου Ενότητα 6: CSS Θρασύβουλος-Κωνσταντίνος Τσιάτσος Άδειες Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας
Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας µέσω της τεχνολογίας των ιαδοχικών Φύλλων Στυλ (cascading
CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML
CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML Εισαγωγή Το CSS (Cascading Style Sheets ή Επικαλυπτόμενα Φύλλα Στυλ) μας επιτρέπει να αλλάξουμε τον τρόπο με τον οποίο παρουσιάζονται τα στοιχεία
1. <body> 2. <header> 3. <h1> My Page </h1> 4. </header> 5. <section>
Ενδεικτικές ερωτήσεις 1. Τι σημαίνουν τα αρχικά CSS 2. Τι σημαίνουν τα αρχικά HTML 3. Ποια η διαφορά μεταξύ Internet και Web; a. Είναι το ίδιο b. Το Web είναι μια υπηρεσία του διαδικτύου 4. Ποια η διαφορά
Εισαγωγή στην HTML. Κεφ. HTML + CSS
Εισαγωγή στην HTML Κεφ. HTML + CSS Συστατικά καλής Ιστοσελίδας α) HTML για το Περιεχόμενο β) CSS για τη μορφοποίηση γ) Javascript για διαδραστικότητα Παράδειγμα Ολυμπιακός Πανιώνιος ΠΑΟΚ Παναθηναϊκός Ξάνθη
Εργαστήριο #9 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. βεβαιωθείτε ότι έχετε ολοκληρώσει τις προηγούμενες ασκήσεις Οδηγίες
Εργαστήριο #9 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε
Στις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver.
Στις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver. 37 Αφού καθορίσετε τα βασικά στοιχεία του νέου κανόνα css, όπως είδαµε στις προηγούµενες διαφάνειες,
Γαβαλάς Δαμιανός dgavalas@aegean.gr
Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας Δικτυακά Πολυμέσα IΙ (Β Έτος, 4ο εξ) Εργαστήριο #3ο: Ορισμός επιλογέων, μορφοποίηση με CSS Γαβαλάς Δαμιανός
Η γλώσσα HTML. Επιμέλεια: Δέγγλερη Σοφία
Η γλώσσα HTML Επιμέλεια: Δέγγλερη Σοφία Υπερκείμενο Το δομικό χαρακτηριστικό του Παγκόσμιου Ιστού Ένα αρχείο Απλό κείμενο και υπερσύνδεσμοι Υπερσύνδεσμος Μετάβαση σε διάφορα άλλα έγγραφα Αποτελείται από
Στοιχεία ορισμού θέσης (Positioning Elements)
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #7 0 : Ορισμός θέσης σε διατάξεις (positioned layouts). Γαβαλάς Δαμιανός dgavalas@aegean.gr Στοιχεία ορισμού θέσης (Positioning Elements) Οι ιδιότητες τοποθέτησης των CSS
Σπουδές 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
Σχεδιασμός και Ανάπτυξη Ιστότοπων
Σχεδιασμός και Ανάπτυξη Ιστότοπων CSS: Ιδιότητες μορφοποίησης κειμένου Παρουσίαση 14 η 1 Βελώνης Γεώργιος Καθηγητής Browsers δοκιμών Οι δοκιμές έγιναν στους παρακάτω browsers και εκδόσεις τους: Google
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I Διαδικτυακή Εφαρμογή (1/2) Ως διαδικτυακή εφαρμογή μπορούμε
Σχεδίαση και Ανάπτυξη Ιστότοπων
Σχεδίαση και Ανάπτυξη Ιστότοπων HTML Καθορισμός Χρωμάτων και Γραμματοσειρών σε μια ιστοσελίδα Παρουσίαση 7 η Βελώνης Γεώργιος Καθηγητής 1 Σημασία συμβόλων HTML5 tags. Obsolete tags: Μην αφήνετε αυτές τις
Ποιες είναι οι κύριες ετικέτες που χρησιμοποιεί η HTML για την περιγραφή της συνολικής δομής μιας ιστοσελίδας;
Τι είναι η HTML; Η HTML είναι το ακρωνύμιο των λέξεων HyperText Markup Language, δηλαδή Γλώσσα Χαρακτηρισμού Υπερ Κειμένου και βασίζεται στη γλώσσα SGML, Standard Generalized Markup Language, που είναι
Διάλεξη 6η CSS Advanced
Διάλεξη 6η CSS Advanced Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e. c o. d e. (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Block & Inline elements Advanced
Βαρβάκειο Πρότυπο Γυμνάσιο Εργαστήρι Πληροφορικής Σχολ. Έτος Φύλλο Εργασίας 5
Φύλλο Εργασίας 5 HTML: Χρήση των Cascading Style Sheets (CSS) για τον έλεγχο της εμφάνισης των στοιχείων της html Με τη χρήση CSS πετυχαίνουμε να ελέγξουμε περισσότερο αποτελεσματικά και κυρίως ταχύτερα
Εισαγωγή σε HTML και CSS. Παναγιώτης Τσαρχόπουλος
Εισαγωγή σε HTML και CSS Παναγιώτης Τσαρχόπουλος Περιεχόμενα Εισαγωγικές έννοιες Ορολογία και σύνταξη Κείμενο σε HTML έγγραφα Σύνδεσμοι Ψηφιακές - Ευφυείς Πόλεις - Εισαγωγή σε HTML και CSS 2 Εισαγωγικές
Στην ενότητα αυτή θα δούμε πως με CSS ιδιότητες μπορούμε να ορίσουμε μέγεθος, γραμματοσειρά και άλλα χαρακτηριστικά του κειμένου στην ιστοσελίδα μας
Γραμματοσειρά Στην ενότητα αυτή θα δούμε πως με CSS ιδιότητες μπορούμε να ορίσουμε μέγεθος, γραμματοσειρά και άλλα χαρακτηριστικά του κειμένου στην ιστοσελίδα μας Γραμματοσειρά κειμένου Με την CSS ιδιότητα
Οδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!).
Εργαστήριο #8 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε
Άσκηση 6 Επαναληπτική Άσκηση HTML
Άσκηση 6 Επαναληπτική Άσκηση HTML ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει τον τύπο του αρχείου Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο
Σχεδόν όλες οι ιστοσελίδες βασίζονται σε μεγάλο βαθμό σε πίνακες. Για να εισάγουμε έναν πίνακα επιλέγουμε από το μενού Insert->Table.
DreamWeaver - Άσκηση 4η Πίνακες Παρακάτω θα δούμε πως μπορούμε να δημιουργούμε και να επεξεργαζόμαστε πίνακες, μια πολύ βασική δομή. Θα δούμε πως γίνεται εισαγωγή πίνακα, ένωση κελιών του πίνακα, προσθήκη
Cascading Style Sheets
Cascading Style Sheets CSS είναι το ακρωνύµιο του Cascading Style Sheets (Επικαλυπτόµενα φύλλα στυλ). CSS είναι µια γλώσσα style δηλ. µια γλώσσα η οποία καθορίζει τη εµφάνιση HTML εγγράφων. Για παράδειγµα,
Εισαγωγή στην Επιστήμη Υπολογιστών. Εισαγωγή στην HTML. Άννα Κεφάλα Παναγιώτα Μιχόλια
Εισαγωγή στην Επιστήμη Υπολογιστών Εισαγωγή στην HTML Άννα Κεφάλα Παναγιώτα Μιχόλια Εργαστηριακές Σημειώσεις ΕΙΣΑΓΩΓΗ ΣΤΗ ΓΛΩΣΣΑ HTML ΜΕΡΟΣ Β': CSS ΚΑΙ FORMS 2 Cascading Style Sheets (CSS) Cascading Style
Προγραμματισμός Διαδικτύου Ασκήσεις Εργαστηρίου
Προγραμματισμός Διαδικτύου Ασκήσεις Εργαστηρίου Ενότητα: ΕΡΓΑΣΤΗΡΙΑΚΗ ΑΣΚΗΣΗ Νο 03 Δρ. Μηνάς Δασυγένης mdasyg@ieee.org Τμήμα Μηχανικών Πληροφορικής και Τηλεπικοινωνιών Εργαστήριο Ψηφιακών Συστημάτων και
CSS. Cascading Style Sheets. Γλώσσες και Τεχνολογίες Ιστού Τμήμα Πληροφορικής - ΑΤΕΙ Θεσσαλονίκης
CSS Cascading Style Sheets CSS Τα Cascading Style Sheets ορίζουν τις ιδιότητες παρουσίασης των στοιχεία της HTML. Αρχικά η HTML δεν περιελάμβανε στοιχεία για την εμφάνιση / παρουσίαση της πληροφορίας αλλά
Σχεδίαση και Ανάπτυξη Ιστότοπων. HTML Στοιχεία - Βασικές Ετικέτες Ειδικοί Χαρακτήρες Παρουσίαση 5 η. Βελώνης Γεώργιος Καθηγητής Πληροφορικής ΠΕ20
Σχεδίαση και Ανάπτυξη Ιστότοπων HTML Στοιχεία - Βασικές Ετικέτες Ειδικοί Χαρακτήρες Παρουσίαση 5 η 1 Βελώνης Γεώργιος Καθηγητής Σημασία συμβόλων HTML5 tags Obsolete tags: Μην αφήνετε αυτές τις ετικέτες
ΣΗΜΑΣΙΟΛΟΓΙΚΟΣ ΙΣΤΟΣ - XML
ΠΑΝΕΠΙΣΤΗΜΙΟ ΠΕΙΡΑΙΩΣ ΤΜΗΜΑ ΨΗΦΙΑΚΩΝ ΣΥΣΤΗΜΑΤΩΝ ΣΗΜΑΣΙΟΛΟΓΙΚΟΣ ΙΣΤΟΣ - XML Εργαστήριο 4 Στουγιάννου Ελευθερία estoug@unipi.gr Περιεχόμενα Τέταρτου Εργαστηριακού Μαθήματος XML CSS (CASCADING STYLE SHEETS)
Νέες Τεχνολογίες στην Εκπαίδευση
Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Μορφοποίηση κειμένου Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης Το παρόν εκπαιδευτικό
Πίνακες. ιδιότητες ετικέτας <tr>
Πίνακες ιδιότητες ετικέτας Ιδιότητα align στοιχίζει κατά την οριζόντια διεύθυνση τα περιεχόμενα μιας γραμμής του πίνακα αριστερά (left), δεξιά (right), στο κέντρο (center), ή με πλήρη στοίχιση (justify)
Εισαγωγη στην html. Η δομή μιας ιστοσελίδας (αρχείο html) Η βασική δομή ενός αρχείου html είναι η εξής: <html> <head>
Εισαγωγη στην html Ο παγκόσμιος ιστός (αγγ.: World Wide Web ή www) είναι η πιο δημοφιλής υπηρεσία που μας παρέχει το Διαδίκτυο (Internet) και είναι ένα σύστημα διασυνδεδεμένων πληροφοριών (κειμένου, εικόνας,
Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας
Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας ικτυακά Πολυμέσα Ι (Β Έτος, 3ο εξ) ιάλεξη #6η: HTML: ετικέτες ΜΕΤΑ, Cascading Style Sheet (CSS) Γαβαλάς Δαμιανός
Σχεδιασμός και Ανάπτυξη Ιστοτόπων. ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος
Σχεδιασμός και Ανάπτυξη Ιστοτόπων ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος H γλώσσα HTML Άλλες Βιβλιογραφικές πηγές για HTML http://www.w3schools.com/html/ http://www.it.uom.gr/project/html2/lessons.html
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
<HTML> <HEAD> <TITLE> <BODY>
ΑΣΚΗΣΗ 1 1. Ανοίξτε τον επεξεργαστή ιστοσελίδων 2. Αποθηκεύστε στο X:/mathimata/html/askiseis/ με όνομα askisi1b.html 3. Θα φτιάξουμε μια νέα ιστοσελίδα, χρησιμοποιώντας τις βασικές ετικέτες
Πίνακες. ετικέτα <table>
Πίνακες ετικέτα σύνταξη κελί 1 κελί 2 κελί 3 κελί 4 : πίνακας : γραμμή : κελί Ιδιότητα border border : ορίζει
Βαρβάκειο Πρότυπο Γυμνάσιο
Παραδόσεις & εργαστηριακές ασκήσεις στην HTML Βαρβάκειο Πρότυπο Γυμνάσιο Σχολ. Χρονιά 2016-2017 Θ. Οτζάκογλου Εργαστήρι Πληροφορικής Σχολ. Έτος 2016 2017 Αν και δεν είναι μία ακόμη «γλώσσα προγραμματισμού»,
Βαρβάκειο Πρότυπο Γυμνάσιο
Παραδόσεις & εργαστηριακές ασκήσεις στην HTML Βαρβάκειο Πρότυπο Γυμνάσιο Σχολ. Χρονιά 2017-2018 Θ. Οτζάκογλου Εργαστήρι Πληροφορικής Σχολ. Έτος 2016 2017 Αν και δεν είναι μία ακόμη «γλώσσα προγραμματισμού»,
Σημασιολογικός Ιστός (Semantic Web) - XML
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Σημασιολογικός Ιστός (Semantic Web) - XML 8/11/2016 Δρ. Ανδριάνα Πρέντζα Αναπληρώτρια Καθηγήτρια aprentza@unipi.gr Πανεπιστήμιο Πειραιά Τμήμα Ψηφιακών Συστημάτων
Υπερσυνδέσεις (hyperlinks)
Υπερσυνδέσεις (hyperlinks) Οι υπερσυνδέσεις αποτελούν το δυναμικό στοιχείο σε ένα έγγραφο html. Με τις υπερσυνδέσεις είναι δυνατή, εύκολη και γρήγορη η μετάβαση ή η παραπομπή από ένα αρχείο html (πηγή)
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II Εισαγωγή Εικόνων Οι φυλλομετρητές μπορούν να εμφανίσουν ένθετες
CTEC-153: ΥΠΟΛΟΓΙΣΤΙΚΑ ΦΥΛΛΑ
ΜΑΘΗΜΑ 5 ΣΤΟΧΟΙ: 1. Μορφοποίηση Αριθμών 2. Αλλαγή Μεγέθους Και Τύπου Γραμματοσειράς 3. Χρησιμοποίηση Πλάγιων, Έντονων, Υπογραμμισμένων Χαρακτήρων 4. Αλλαγή Χρώματος Γραμματοσειράς 5. Παράθυρο Διαλόγου
ΕΠΛ 012. ιαδοχικά Φύλλα Στυλ
ΕΠΛ 012 ιαδοχικά Φύλλα Στυλ Cascading Style Sheets (CSS) Φύλλα Στυλ Μηχανισµός καθορισµού και τροποποίησης µορφοποίησης εγγράφων από τους συγγράφεις Πιο γενικός τρόπος από το καθορισµό όλων των χαρακτηριστικών
ΗTML και XHTML Βασικές. Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας
ΗTML και XHTML Βασικές έννοιες Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας Η γραμματική της ΗΤML Όπως κάθε γλώσσα έχει μια γραμματική
Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML)
Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML) 1. Δημιουργία μιας απλής σελίδας HTML Ανοίξτε το Notepad ακολουθώντας τη διαδρομή Start All Programs Accessories Notepad Πληκτρολογήστε το ακόλουθο κείμενο:
ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ
ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ Βαγγελιώ Καβακλή Τμήμα Πολιτισμικής Τεχνολογίας & Επικοινωνίας 8 Μαρτίου 2001 Hypertext Markup Language (HTML)! Σε μια ιστοσελίδα μπορούν να εμφανίζονται διαφορετικά
ΜΑΘΗΜΑ 5 ΣΤΟΧΟΙ: Τρόπος 1:
ΜΑΘΗΜΑ 5 ΣΤΟΧΟΙ: 1. Εισαγωγή Εικόνας 2. Εισαγωγή Αρχείου Γραφικού 3. Εισαγωγή Αυτόματου Σχήματος 4. Τροποποίηση Γραφικών Αντικειμένων 5. Αλλαγή Μεγέθους Γραφικού Αντικειμένου 6. Περιστροφή Γραφικού Αντικειμένου
Κεφάλαιο 4 HyperText Markup Language - HTML. Προγραμματιστικά εργαλεία για το διαδίκτυο Φίλιππος Κουτσάκας, Πολύγυρος 2013
Κεφάλαιο 4 HyperText Markup Language - HTML Προγραμματιστικά εργαλεία για το διαδίκτυο Φίλιππος Κουτσάκας, Πολύγυρος 2013 Τι είναι η HTML; Ένας τρόπος για να πεις στον σελιδομετρητή πώς να αναπαραστήσει
Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς
3.3.1.1 Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς Γραμματοσειρές Η λέξη γραμματοσειρά αναφέρεται στο στυλ που εμφανίζονται τα γράμματα. Παρακάτω ακολουθούν κάποια παραδείγματα,
ΜΑΘΗΜΑ Στοίχιση Παραγράφων. 2. Εσοχές Παραγράφων ΣΤΟΧΟΙ:
ΜΑΘΗΜΑ 4 ΣΤΟΧΟΙ: 1. Στοίχιση Παραγράφων 2. Εσοχές Παραγράφων 3. Διάστημα Μεταξύ Γραμμών (Διάστιχο) 4. Απόσταση Μεταξύ Παραγράφων 5. Καθορισμός Στηλοθετών (Tabs) 6. Μετακίνηση Στηλοθετών 7. Διαγραφή Στηλοθετών
ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ. Κειμενογράφος WORD
ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ Κειμενογράφος WORD ΣΚΟΠΟΣ Η ανάπτυξη δεξιοτήτων επεξεργασίας κειμένου ΠΡΟΤΑΣΕΙΣ ΚΑΙ ΡΥΘΜΙΣΕΙΣ Άνω περιθώριο (top margin) : 2.49cm Κάτω περιθώριο (bottom margin) :5.99cm Αριστερό περιθώριο
ΕΙΔΙΚΟΙ ΧΑΡΑΚΤΗΡΕΣ ΧΑΡΑΚΤΗΡΕΣ ΜΕ ΕΙΔΙΚΕΣ ΛΕΙΤΟΥΡΓΙΕΣ. ΠΙΝΑΚΑΣ ΚΩΔΙΚΩΝ ΔΙΑΦΥΓΗΣ Χαρακτήρας Κωδικός διαφυγής Ερμηνεία Συμβόλου & nbsp;
ΕΙΔΙΚΟΙ ΧΑΡΑΚΤΗΡΕΣ Υπάρχουν ειδικοί χαρακτήρες που δεν μπορούν να απεικονισθούν με απλές πληκτρολογήσεις (πατώντας ένα πλήκτρο ή ένα πλήκτρο και το Shift) αλλά μόνο με πιο περίπλοκους τρόπους (π.χ. πατώντας
12. HTML και CSS. Προαπαιτούμενες Γνώσεις: Απλή γνώση της σύνταξης HTML. Αρκεί η άσκηση «Η γλώσσα HTML Εισαγωγή».
12. HTML και CSS Σκοπός του Εργαστηρίου: Σκοπός της παρούσας εργαστηριακής άσκησης είναι η εισαγωγή στην τεχνολογία Cascading Style Sheets (CSS), η εξοικείωση με τις βασικές αρχές και χρήσεις της και τη
ΓΡΑΦΙΚΕΣ ΠΑΡΑΣΤΑΣΕΙΣ ΜΕ ΕXCEL
ΓΡΑΦΙΚΕΣ ΠΑΡΑΣΤΑΣΕΙΣ ΜΕ ΕXCEL 1. Εισαγωγή δεδομένων σε φύλλο εργασίας του Microsoft Excel Για να τοποθετήσουμε τις μετρήσεις μας σε ένα φύλλο Excel, κάνουμε κλικ στο κελί στο οποίο θέλουμε να τοποθετήσουμε
ΑΣΠΑΙΤΕ. ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ 4α. Υπερκείμενο και HTML. Ημερομηνία :... Τμήμα :... Ονοματεπώνυμο :...
ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ 4α Υπερκείμενο και HTML ΑΣΠΑΙΤΕ Ημερομηνία :... Τμήμα :... Ονοματεπώνυμο :... Η HTML (HyperText Markup Language) είναι η γλώσσα που χρησιμοποιείται για να περιγράψει τη δομή και τη διαμόρφωση
1. Κλικ στην καρτέλα Insert 2. Tables 3. Κλικ Table 4. Σύρουμε το δείκτη του ποντικιού και επιλέγουμε τον επιθυμητό αριθμό γραμμών και στηλών
ΜΑΘΗΜΑ 4 ΣΤΟΧΟΙ: 1. Προσθήκη Πίνακα (Table) 2. Εισαγωγή Και Μετακίνηση Κειμένου Σε Πίνακα 3. Εισαγωγή Στηλών Και Γραμμών Σε Πίνακα 4. Διαγραφή Στηλών Και Γραμμών Σε Πίνακα 5. Αλλαγή Πλάτους Στηλών Και
Γραπτή εξέταση. Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Διάλεξη #12 η : Επανάληψη, προετοιμασία για τις γραπτές εξετάσεις
Δικτυακά Πολυμέσα ΙΙ Διάλεξη #12 η : Επανάληψη, προετοιμασία για τις γραπτές εξετάσεις Γαβαλάς Δαμιανός dgavalas@aegean.gr Γραπτή εξέταση H διάρκεια της εξέτασης θα είναι 2 ώρες και 15 Θα απαντήσετε σε
PowerPoint Ένα εργαλείο παρουσίασης
Εργασία 7η 2 Αρκετοί πιστεύουν πως η επιτυχία μιας παρουσίασης είναι δεδομένη εάν ο παρουσιαστής κατέχει το θέμα που πρόκειται να παρουσιάσει και είναι σε θέση να χειρίζεται ί ά άνετα έ ένα πρόγραμμα ό
ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ
ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ Κεφάλαιο 4. Η γλώσσα HTML Επιμέλεια: Καραγιάννης Σπύρος Καθηγητής ΠΕ19 Βασικοί κανόνες σύνταξης HTML ομή σελίδας HTML Μορφοποίηση κειμένου Κατάλογοι Εισαγωγή
Σχεδίαση ιστοσελίδων
Τ.Ε.Ι. Δυτικής Ελλάδας Σχολή Διοίκησης και Οικονομίας Τμήμα Διοίκησης Επιχειρήσεων - Πάτρα Σχεδίαση ιστοσελίδων Θεώνη Πιτουρά, Γιάννης Κουτσονίκος Σημειώσεις για το Εργαστήριο «Επιχειρηματικές δικτυακές
1 ο Εργαστήριο Συντεταγμένες, Χρώματα, Σχήματα
1 ο Εργαστήριο Συντεταγμένες, Χρώματα, Σχήματα 1. Σύστημα Συντεταγμένων Το σύστημα συντεταγμένων που έχουμε συνηθίσει από το σχολείο τοποθετούσε το σημείο (0,0) στο σημείο τομής των δυο αξόνων Χ και Υ.
Σε αυτό το μάθημα θα ασχοληθούμε με τη βελτίωση της εμφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισμό όλων των αλλαγών τις οποίες επιθυμούμε να
Σε αυτό το μάθημα θα ασχοληθούμε με τη βελτίωση της εμφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισμό όλων των αλλαγών τις οποίες επιθυμούμε να κάνουμε μέσω ενός εξωτερικού αρχείου.το αρχείο αυτό
Coding Bootcamp. Εισαγωγή στo CSS
Εισαγωγή στo CSS CSS (Cascading Style Sheets) Η Html σχεδιάστηκε αρχικά για να προβάλλει κείμενο και είχε σκοπό να «ορίσει» το περιεχόμενο μιας σελίδας υπό την έννοια ποιο κείμενο είναι επικεφαλίδα, ποιο
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
Διάλεξη 4η CSS intermediate
Διάλεξη 4η CSS intermediate Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e. c o. d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Κλάσεις & Ids Εμφώλευση &
Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML
Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο για το αρχείο Ορίζει το σώµα της background URL
Κειµενογράφοι ετικετών
ΕΠΛ 012 Γλώσσα Μορφοποίησης HTML Πως κτίζουµε τις Ετικέτες Notepad ή άλλο TEXT editor Πού τα κάνουµε Save? Πώς τα οργανώνουµε Πώς τα βάζουµε δηµόσια online Τα αρχεία να τελειώνουν σε.html ή.htm Πως ξεκινούµε
ΕΠΛ 012. Φύλλα Στυλ (ΙΙ)
ΕΠΛ 012 Φύλλα Στυλ (ΙΙ) Τροποποίηση χρωµάτων Color: "όνοµα χρώµατος" rgb (rr,gg,bb) #RRGGBB RGB συνιστώσες όπου rr,gg,bb είναι ακέραιοι από το 0 255 H1 {color: rgb(255,0,0)} κόκκινες επικεφαλίδες background-colorcolor
Πίνακες HTML. Παναγιώτης Γαλάτης 1ο ΕΠΑΛ Ηρακλείου
Πίνακες HTML Παναγιώτης Γαλάτης 1ο ΕΠΑΛ Ηρακλείου Τι είναι Πίνακας Ένας πίνακας στοιχείων αποτελείται από γραμμές και στήλες. Το σημείο τομής μιας γραμμής και μιας στήλης ονομάζεται κελί (cell( cell).