Cascading Style Sheets (CSS)
|
|
- Αρμονία Βουγιουκλάκης
- 7 χρόνια πριν
- Προβολές:
Transcript
1 Cascading Style Sheets (CSS) Τα Cascading Style Sheets προσφέρουν έναν εύκολο τρόπο για να ορίσουμε τη μορφοποίηση που επιθυμούμε να έχουν οι σελίδες μία τοποθεσίας του Παγκόσμιου Ιστού που δημιουργούμε. Δίνοντας κάποιες οδηγίες CSS μπορούμε να επηρεάσουμε τη μορφοποίηση όλων ή μερικών από τις ιστοσελίδες μας και μπορούμε έτσι να επιτύχουμε εύκολα την ομοιόμορφη εμφάνισή τους. Θα περιγράψουμε πιο κάτω έναν τρόπο για να δηλώσουμε τη μορφοποίηση που επιθυμούμε: Έστω ότι θέλουμε να ορίσουμε τη μορφοποίηση της σελίδας page1.htm. Εάν δώσουμε π.χ. την οδηγία <link rel=stylesheet type="text/css" href="mystyle.css"> στο τμήμα <HEAD> του αρχείου, δηλώνουμε ότι η σελίδα μας θα ακολουθήσει τις οδηγίες μορφοποίησης που περιέχονται στο αρχείο με όνομα mystyle.css (το οποίο καλά είναι να βρίσκεται στον ίδιο φάκελο με το page1.htm). Εάν εισάγουμε την ίδια εντολή και σε ένα άλλο ή περισσότερα html αρχεία, τότε ρυθμίζουμε αυτόματα την μορφοποίηση για όλα αυτά τα αρχεία αφού όλα παίρνουν οδηγίες μορφοποίησης από το αρχείο mystyle.css. Το αρχείο mystyle.css περιγράφει τον τρόπο με τον οποίο θα εμφανίζονται τα διάφορα στοιχεία της σελίδας μας (π.χ. χρώμα, θέση, περίγραμμα κτλ στοιχείων όπως παράγραφοι, εικόνες, επικεφαλίδες κτλ.). Αρχεία αυτής της μορφής έχουν συνήθως την επέκταση.css (χωρίς αυτό να είναι απαραίτητο) και περιέχουν οδηγίες όπως οι παρακάτω: h1{color:green;border:thick solid black;text align: center} p.gr{color:red; text align: right} Οι συγκεκριμένες οδηγίες δηλώνουν ότι όλες οι επικεφαλίδες τύπου <h1> θα εμφανιστούν με χρώμα πράσινο, με περίγραμμα χοντρό, συνεχές και μαύρο και με στοίχιση στο κέντρο. Επίσης όλες οι παράγραφοι που είναι του τύπου gr θα έχουν χρώμα κόκκινο και στοίχιση στα δεξιά. Για να δηλώσω σε μία σελίδα μου ότι μία παράγραφος είναι τύπου gr αρκεί να βάλω <p class=gr> (αντί για gr μπορεί να χρησιμοποιηθεί οποιοδήποτε όνομα). Γενικά μπορούμε να χρησιμοποιήσουμε ονόματα χρωμάτων όπως: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow ή να χρησιμοποιήσουμε 6 δεκαεξαδικά ψηφία, δύο για κάθε ένα από τα χρώματα Red, Green και Blue (RGB). Ένα περίγραμμα μπορεί να έχει ένα από τα πιο κάτω στυλ: dotted, dashed, solid, double, groove, ridge, inset και outset Επίσης το πάχος του μπορεί να είναι: thin, medium, thick Άσκηση Να δημιουργήσετε ένα αρχείο με το όνομα style.css και να δώσετε τις οδηγίες μορφοποίησης όπως φαίνονται πιο πάνω. Στη συνέχεια, να ανοίξετε ένα αρχείο ιστοσελίδας και να εισάγετε σε αυτό την εντολή <link rel=stylesheet type="text/css" href="mystyle.css"> στο τμήμα <HEAD>. Να δηλώσετε επίσης κάποιες παραγράφους ότι είναι τάξης gr (δίνοντας class=gr μέσα στην εντολή παραγράφου <p>). Να δείτε πώς εμφανίζεται η σελίδα σας. 1
2 Γενικά έχουμε τέσσερις τρόπους για να εισάγουμε μορφοποιήσεις CSS σε μία σελίδα. 1 ος τρόπος Είναι ο τρόπος που περιγράψαμε στην προηγούμενη άσκηση. Όπως είδαμε, εισάγουμε την εντολή <link rel=stylesheet type="text/css" href="όνομα αρχείου css"> μέσα στο τμήμα <HEAD> των σελίδων που θέλουμε να μορφοποιήσουμε. Οι οδηγίες μορφοποίησης περιέχονται σε ξεχωριστό αρχείο, το οποίο έχει συνήθως επέκταση.css. 2 ος τρόπος Γράφουμε μέσα στο HEAD του HTML αρχείου: <style type="text/css"> <!-- οδηγίες για style sheets --> </style> Δηλ. όλες οι CSS οδηγίες δεν περιέχονται σε ξεχωριστό αρχείο αλλά μέσα στο ίδιο το html αρχείο. Τα σύμβολα <!-- και --> τα βάζουμε για την περίπτωση που κάποιο πρόγραμμα πλοήγησης δεν υποστηρίζει μορφοποίηση CSS. 3 ος τρόπος Χρησιμοποιούμε το import αντί για το link, μέσα στο HEAD του HTML αρχείου: <style type="text/css" > url(θέση css αρχείου); --> </style> Μοιάζει με τον πρώτο τρόπο, ο οποίος και χρησιμοποιείται συνήθως. 4 ος τρόπος Βάζουμε τις οδηγίες μορφοποίησης μέσα στο στην html εντολή (tag) που θέλουμε να ορίσουμε τα χαρακτηριστικά του. Π.χ. αν θέλουμε να ορίσουμε τα χαρακτηριστικά για μία ετικέτα <P> μπορούμε να δώσουμε: <P style="color: red; font-family: 'New Century Schoolbook', serif"> Μερικές από τις ιδιότητες μορφοποίησης που μπορούμε να ρυθμίσουμε μέσω CSS είναι οι πιο κάτω: Font Family Η γραμματοσειρά που χρησιμοποιηθεί. Π.χ. font-family: serif ή font-family: sans-serif ή font-family:times Font Style Αν έχουμε πλάγια γράμματα ή όχι. Π.χ. font-style: normal ή italic ή oblique Font Variant Για κεφαλαία μικρού μεγέθους γράμματα. Π.χ. font-variant: normal ή small-caps 2
3 Font Weight Πάχος των γραμμάτων Π.χ. font-weight: normal ή bold ή bolder ή lighter ή μία τιμή από 100 ως 900 Font Size Μέγεθος γραμματοσειράς Π.χ. font-size: xx-small ή x-small ή small ή medium ή large ή x-large ή xxlarge ή larger ή smaller ή μέγεθος όπως π.χ.12pt ή 150% Font Δίνοντας font μπορούμε να ρυθμίσουμε όλα τα πιο πάνω χαρακτηριστικά. Π.χ. font: italic bold 12pt Times Color Χρώμα Π.χ. color: red ή color:#00ffaa Background Color Χρώμα φόντου Π.χ. background-color: blue ή #00ffaa ή transparent Background Image Εικόνα φόντου background-image: θέση (όνομα) εικόνας Background Repeat Προσδιορίζουμε αν το φόντο θα επαναλαμβάνεται οριζόντια ή κατακόρυφα. Π.χ. background-repeat: repeat ή repeat-x ή repeat-y ή no-repeat Background Attachment Προσδιορίζει αν το φόντο θα κυλάει μαζί με το περιεχόμενο της σελίδας ή αν θα είναι σταθερό. Π.χ. background-attachment: scroll ή fixed Background Με το background μπορούμε να προσδιορίσουμε όλα τα πιο πάνω χαρακτηριστικά. Word Spacing Απόσταση λέξεων Π.χ. word-spacing: normal ή 0.4em ( το em είναι το πλάτος που έχει το γράμμα m). Letter Spacing Απόσταση γραμμάτων Π.χ. letter-spacing: normal ή 0.1em Text Decoration Χαρακτηριστικά των γραμμάτων όπως υπογράμμιση, αναβόσβησμα κτλ. Π.χ. text-decoration: none ή underline ή line-through ή blink 3
4 Vertical Alignment Κατακόρυφη θέση των γραμμάτων (εκθέτης, δείκτης κτλ.) Π.χ. vertical-align: baseline, sub, super, top, text-top, middle, bottom ή αριθμός 25% Text Transformation Μετατροπή των γραμμάτων σε μικρά ή κεφαλαία Π.χ. text-transform: none ή capitalize ή uppercase ή lowercase Text Alignment Στοίχιση κειμένου text-align: left, right, center ή justify Line Height Ύψος γραμμής κειμένου (διάστιχο) Π.χ. line-height: normal ή 200% ή 2 Top Margin Επάνω περιθώριο Π.χ. margin-top: 2cm Right Margin Δεξί περιθώριο Π.χ. margin-top: 1cm Bottom Margin Κάτω περιθώριο Π.χ. margin-bottom: 1em Left Margin Αριστερό περιθώριο Π.χ. margin-left: 2em Margin Μπορούμε να προσδιορίσουμε όλα τα περιθώρια ταυτόχρονα. Π.χ. margin: 5em (όλα τα περιθώρια θα είναι 5em) ή margin: 2em 4em (το πάνω και το κάτω περιθώριο θα είναι 2em και το αριστερό και το δεξί θα είναι 4em) ή margin: 1em 2em 3em 4em (το πάνω περιθώριο 1 em, το δεξί 2em, το κάτω 3em και το αριστερό 4em). Top Padding, Right Padding, Bottom Padding, Left Padding και Padding Τα padding-top, padding-right, padding-bottom, padding-left και padding λειτουργούν όπως ακριβώς τα αντίστοιχα margin αλλά προσδιορίζουν την επιπλέον απόσταση που θα υπάρχει από το περιθώριο (margin). Border Color Χρώμα περιγράμματος Π.χ. border-color: red 4
5 Border Style Στυλ περιγράμματος Π.χ. border-style: none ή dotted ή dashed ή solid ή double ή groove ή ridge ή inset ή outset Border Top Width, Broder Right Width, Border Bottom Width και Border Left Width Δίνοντας π.χ. border-top-width:3 ή thin ή medium ή thick, προσδιορίζουμε το πάχος του πάνω περιγράμματος. Αντίστοιχα για το δεξί, κάτω και αριστερό περίγραμμα. Border Μπορούμε να προσδιορίσουμε όλες μαζί τις ιδιότητες του περιγράμματος. Π.χ. border: thick double red Width Προσδιορίζει το πλάτος ενός αντικειμένου (π.χ. εικόνας). Π.χ. width:100 ή 50% Height Προσδιορίζει το ύψος ενός αντικειμένου. Π.χ. height:100 ή 50% List Style Type Το είδος της κουκίδας σε μία λίστα Π.χ. list-style-type: disc ή circle ή square ή decimal ή lower-roman ή upperroman ή lower-alpha ή upper-alpha ή none 5
Εργαλεία Ανάπτυξης Εφαρμογών Internet. Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής
Εργαλεία Ανάπτυξης Εφαρμογών Internet Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής Το πρότυπο CSS Α Μέρος 2 CSS (Cascading Style Sheets)(1) Ορίζουν την εμφάνιση των στοιχείων σε ένα έγγραφο HTML.
Διαβάστε περισσότεραΗ ΓΛΩΣΣΑ ΕΠΙΚΑΛΥΠΤΩΜΕΝΩΝ ΜΟΡΦΟΠΟΙΗΣΕΩΝ CSS
Η ΓΛΩΣΣΑ ΕΠΙΚΑΛΥΠΤΩΜΕΝΩΝ ΜΟΡΦΟΠΟΙΗΣΕΩΝ CSS Πίνακες Ιδιοτήτων Μορφοποίησης CSS Ιδιότητες Διαστασιολόγησης Στοιχείων height Ορίζει το ύψος ενός στοιχείου auto lenght (px) line-height Ορίζει το ύφος μιας
Διαβάστε περισσότεραΔιάλεξη 2η Εισαγωγή στο CSS
Διάλεξη 2η Εισαγωγή στο CSS Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e c o d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Τι είναι το CSS? Γιατί να χρησιμοποιήσω
Διαβάστε περισσότεραEurope Code Week 7-22 Οκτωβρίου Μία γιορτή δημιουργίας με κώδικα
Europe Code Week 7-22 Οκτωβρίου 2017 7-22 October 2017 Μία γιορτή δημιουργίας με κώδικα @CodeWeekEU #codeeu codeeu Εισαγωγή στο Web Development CSS Λίγα λόγια... Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση
Διαβάστε περισσότεραΝέες Τεχνολογίες στην Εκπαίδευση
Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Επάλληλα φύλλα στυλ (CSS): Μια εισαγωγή Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης
Διαβάστε περισσότερα<a href="http://www.somepage.com/somepage.html">μετάβαση στο κείμενο</a>.
HTML Τα αρχεία της HTML έχουν ετικέτες (tags) που ορίζουν τη δομή και τη μορφοποίηση των ιστοσελίδων. Οι περισσότερες HTML ετικέτες τις συναντούμε ως ζεύγη τα οποία ενεργούν στα περιεχόμενα μεταξύ των
Διαβάστε περισσότεραCSS 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 1 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης Creative
Διαβάστε περισσότεραΗ Βίβλος των CSS - Μέρος 3 Το Box Model, τα Περιθώρια και τα Περιγράμματα
Η Βίβλος των CSS - Μέρος 3 Το Box Model, τα Περιθώρια και τα Περιγράμματα Το Box Model Το box model στα CSS περιγράφει τα πλαίσια (boxes) που δημιουργούνται για τα στοιχεία (elements) της HTML. Το box
Διαβάστε περισσότεραΘέματα Προγραμματισμού Διαδικτύου ~ CSS ~
Θέματα Προγραμματισμού Διαδικτύου ~ CSS ~ Στελιος Σφακιανάκης Εαρινό 2019 Αυτή η εργασία χορηγείται με άδεια Creative Commons Αναφορά Δημιουργού - Μη Εμπορική Χρήση - Παρόμοια Διανομή 1 Εισαγωγή στο CSS
Διαβάστε περισσότεραΗ γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή.
Εισαγωγή στο CSS Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή. Πλεονεκτήματα CSS έναντι χρήσης μόνο HTML Μεγαλύτερη ευελιξία μορφοποιήσεων. Το CSS κατέστησε
Διαβάστε περισσότεραΒασικά στοιχεία του CSS
Βασικά στοιχεία του CSS Περιεχόμενα Τι είναι CSS Πλεονεκτήματα CSS μορφοποίησης Συντακτικό του CSS Ιδιότητες CSS Εφαρμογή CSS κανόνων Επικάλυψη CSS κανόνων 2 Μορφοποίηση με HTML Η HTML είναι σχεδιασμένη
Διαβάστε περισσότεραΗ Βίβλος των CSS. Εισαγωγή στα CSS
Η Βίβλος των CSS Εισαγωγή στα CSS Τα Διαδοχικά Φύλλα Στυλ (CSS, Cascading Style Sheets) αποτελούν ένα πολύ καλό εργαλείο για να μπορούμε να αλλάζουμε την εμφάνιση και τη διάταξη (layout) των ιστοσελίδων
Διαβάστε περισσότεραΤο απεικονιστικό μοντέλο μορφοποίησης των CSS
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #6 0 : CSS: Χρήση των ιδιοτήτων του κουτιού (box properties). Διάταξη σελίδων Γαβαλάς Δαμιανός dgavalas@aegean.gr Το απεικονιστικό μοντέλο μορφοποίησης των CSS Περιγράφει
Διαβάστε περισσότεραΕτικέτες HTML. <!-->: Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον
Ετικέτες HTML : Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον πηγαίο κώδικα για να διευκολύνουμε την επεξεργασία και την συντήρηση του αρχείου. Τα σχόλια δεν εμφανίζονται στην οθόνη
Διαβάστε περισσότεραΣχεδιασμός και Ανάπτυξη Ιστότοπων
Σχεδιασμός και Ανάπτυξη Ιστότοπων CSS: Φόντο (background) και Περίγραμμα (border) στοιχείου ιστοσελίδας Παρουσίαση 16 η 1 Βελώνης Γεώργιος Καθηγητής Browsers δοκιμών Οι δοκιμές έγιναν στους παρακάτω browsers
Διαβάστε περισσότεραΣχεδιασμός και Ανάπτυξη Ιστότοπων
Σχεδιασμός και Ανάπτυξη Ιστότοπων CSS: Ιδιότητες μορφοποίησης κειμένου Παρουσίαση 14 η 1 Βελώνης Γεώργιος Καθηγητής Browsers δοκιμών Οι δοκιμές έγιναν στους παρακάτω browsers και εκδόσεις τους: Google
Διαβάστε περισσότεραCSS 2. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος. Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 2 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης
Διαβάστε περισσότεραΠεριεχόμενα. Γαβαλάς Δαμιανός
Δικτυακά Πολυμέσα ΙΙ Διάλεξη #5 η : Τυπογραφία στο web Γαβαλάς Δαμιανός dgavalas@aegean.gr Περιεχόμενα Κατανόηση αρχών σχεδιασμού με γραμματοσειρές Κατανόηση των μονάδων μέτρησης που χρησιμοποιούνται στα
Διαβάστε περισσότεραCSS. Εισαγωγή & Βασικές έννοιες. Cascading Style Sheets. Επικαλυπτόμενα φύλλα στυλ
CSS Εισαγωγή & Βασικές έννοιες Cascading Style Sheets Επικαλυπτόμενα φύλλα στυλ Περιεχόμενα Τι είναι CSS Πλεονεκτήματα CSS μορφοποίησης Συντακτικό του CSS Ιδιότητες CSS Εφαρμογή CSS κανόνων Επικάλυψη 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 προσδιορίζει τη βασική
Διαβάστε περισσότεραΓαβαλάς Δαμιανός dgavalas@aegean.gr
Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας Δικτυακά Πολυμέσα IΙ (Β Έτος, 4ο εξ) Εργαστήριο #3ο: Ορισμός επιλογέων, μορφοποίηση με CSS Γαβαλάς Δαμιανός
Διαβάστε περισσότεραΑ ΛΥΚΕΙΟΥ - ΕΦΑΡΜΟΓΕΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΜΑΪΟΣ 2019 ΕΝΔΕΙΚΤΙΚΕΣ ΕΡΩΤΗΣΕΙΣ ΚΑΤΑΝΟΗΣΗΣ
Το υλικό αυτό δίνεται στους μαθητές για τη σωστή μελέτη της διδαχθείσας ύλης του μέρους Β. Πρόκειται για ένα συμπαγή κορμό ερωτήσεων και ασκήσεων οι οποίες καλύφθηκαν κατά τη διάρκεια της έως τώρα σχολικής
Διαβάστε περισσότεραCTEC-153: ΥΠΟΛΟΓΙΣΤΙΚΑ ΦΥΛΛΑ
ΜΑΘΗΜΑ 5 ΣΤΟΧΟΙ: 1. Μορφοποίηση Αριθμών 2. Αλλαγή Μεγέθους Και Τύπου Γραμματοσειράς 3. Χρησιμοποίηση Πλάγιων, Έντονων, Υπογραμμισμένων Χαρακτήρων 4. Αλλαγή Χρώματος Γραμματοσειράς 5. Παράθυρο Διαλόγου
Διαβάστε περισσότεραΣχεδιασμός και Ανάπτυξη Ιστότοπων
Βελώνης Γεώργιος Καθηγητής Σχεδιασμός και Ανάπτυξη Ιστότοπων Εισαγωγή στα CSS (Cascading Style Sheets) Παρουσίαση 13 η 1 Βελώνης Γεώργιος Καθηγητής Περιεχόμενα Εισαγωγή Πλεονεκτήματα χρήσης των CSS Βασικοί
Διαβάστε περισσότεραΣτην τεχνολογία των CSS, οι κανόνες στυλ (style
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #4 0 : CSS: Βασικές και προχωρημένες τεχνικές επιλογής, τα στοιχεία και , ψευδο κλάσεις και ψευδο επιλογείς Γαβαλάς Δαμιανός dgavalas@aegean.gr CSS κανόνες στυλ
Διαβάστε περισσότεραΣτην ενότητα αυτή θα δούμε πως με CSS ιδιότητες μπορούμε να ορίσουμε μέγεθος, γραμματοσειρά και άλλα χαρακτηριστικά του κειμένου στην ιστοσελίδα μας
Γραμματοσειρά Στην ενότητα αυτή θα δούμε πως με CSS ιδιότητες μπορούμε να ορίσουμε μέγεθος, γραμματοσειρά και άλλα χαρακτηριστικά του κειμένου στην ιστοσελίδα μας Γραμματοσειρά κειμένου Με την CSS ιδιότητα
Διαβάστε περισσότεραΗ γλώσσα HTML. Επιμέλεια: Δέγγλερη Σοφία
Η γλώσσα HTML Επιμέλεια: Δέγγλερη Σοφία Υπερκείμενο Το δομικό χαρακτηριστικό του Παγκόσμιου Ιστού Ένα αρχείο Απλό κείμενο και υπερσύνδεσμοι Υπερσύνδεσμος Μετάβαση σε διάφορα άλλα έγγραφα Αποτελείται από
Διαβάστε περισσότερα1. <body> 2. <header> 3. <h1> My Page </h1> 4. </header> 5. <section>
Ενδεικτικές ερωτήσεις 1. Τι σημαίνουν τα αρχικά CSS 2. Τι σημαίνουν τα αρχικά HTML 3. Ποια η διαφορά μεταξύ Internet και Web; a. Είναι το ίδιο b. Το Web είναι μια υπηρεσία του διαδικτύου 4. Ποια η διαφορά
Διαβάστε περισσότεραCSS. Cascading Style Sheets. Γλώσσες και Τεχνολογίες Ιστού Τμήμα Πληροφορικής - ΑΤΕΙ Θεσσαλονίκης
CSS Cascading Style Sheets CSS Τα Cascading Style Sheets ορίζουν τις ιδιότητες παρουσίασης των στοιχεία της HTML. Αρχικά η HTML δεν περιελάμβανε στοιχεία για την εμφάνιση / παρουσίαση της πληροφορίας αλλά
Διαβάστε περισσότεραΆσκηση 6 Επαναληπτική Άσκηση HTML
Άσκηση 6 Επαναληπτική Άσκηση HTML ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει τον τύπο του αρχείου Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο
Διαβάστε περισσότεραΕκπαιδευτικά Περιβάλλοντα Διαδικτύου
ΑΡΙΣΤΟΤΕΛΕΙΟ ΠΑΝΕΠΙΣΤΗΜΙΟ ΘΕΣΣΑΛΟΝΙΚΗΣ ΑΝΟΙΚΤΑ ΑΚΑΔΗΜΑΪΚΑ ΜΑΘΗΜΑΤΑ Εκπαιδευτικά Περιβάλλοντα Διαδικτύου Ενότητα 6: CSS Θρασύβουλος-Κωνσταντίνος Τσιάτσος Άδειες Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται
Διαβάστε περισσότεραΕισαγωγή σε HTML και CSS. Παναγιώτης Τσαρχόπουλος
Εισαγωγή σε HTML και CSS Παναγιώτης Τσαρχόπουλος Περιεχόμενα Εισαγωγικές έννοιες Ορολογία και σύνταξη Κείμενο σε HTML έγγραφα Σύνδεσμοι Ψηφιακές - Ευφυείς Πόλεις - Εισαγωγή σε HTML και CSS 2 Εισαγωγικές
Διαβάστε περισσότεραΓλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης
CASCADING STYLE-SHEETS CASCADING STYLE-SHEETS Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης εφαρµογών HTML. Τα CSS ορίζονται σε δύο συστάσεις του W3C: CSS1, εκ. 1996 περιλαµβάνει περίπου 50 ιδιότητες
Διαβάστε περισσότερα3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ
2014 3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ Εισαγωγή Το CSS (Cascading Style Sheets) είναι αρχεία με κατάληξη.css τα οποία καθορίζουν την μορφοποίηση των ιστοσελίδων. Μέσω αυτών επιτυγχάνεται
Διαβάστε περισσότεραΣχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας
Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας ικτυακά Πολυμέσα Ι (Β Έτος, 3ο εξ) ιάλεξη #6η: HTML: ετικέτες ΜΕΤΑ, Cascading Style Sheet (CSS) Γαβαλάς Δαμιανός
Διαβάστε περισσότεραΠίνακες. ιδιότητες ετικέτας <tr>
Πίνακες ιδιότητες ετικέτας Ιδιότητα align στοιχίζει κατά την οριζόντια διεύθυνση τα περιεχόμενα μιας γραμμής του πίνακα αριστερά (left), δεξιά (right), στο κέντρο (center), ή με πλήρη στοίχιση (justify)
Διαβάστε περισσότεραΣπουδές 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
Διαβάστε περισσότεραΠληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I Διαδικτυακή Εφαρμογή (1/2) Ως διαδικτυακή εφαρμογή μπορούμε
Διαβάστε περισσότεραΚειµενογράφοι ετικετών
ΕΠΛ 012 Γλώσσα Μορφοποίησης HTML Πως κτίζουµε τις Ετικέτες Notepad ή άλλο TEXT editor Πού τα κάνουµε Save? Πώς τα οργανώνουµε Πώς τα βάζουµε δηµόσια online Τα αρχεία να τελειώνουν σε.html ή.htm Πως ξεκινούµε
Διαβάστε περισσότεραCSS 3. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 3 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης
Διαβάστε περισσότεραΕισαγωγή στην HTML. Κεφ. HTML + CSS
Εισαγωγή στην HTML Κεφ. HTML + CSS Συστατικά καλής Ιστοσελίδας α) HTML για το Περιεχόμενο β) CSS για τη μορφοποίηση γ) Javascript για διαδραστικότητα Παράδειγμα Ολυμπιακός Πανιώνιος ΠΑΟΚ Παναθηναϊκός Ξάνθη
Διαβάστε περισσότεραΒαρβάκειο Πρότυπο Γυμνάσιο Εργαστήρι Πληροφορικής Σχολ. Έτος Φύλλο Εργασίας 5
Φύλλο Εργασίας 5 HTML: Χρήση των Cascading Style Sheets (CSS) για τον έλεγχο της εμφάνισης των στοιχείων της html Με τη χρήση CSS πετυχαίνουμε να ελέγξουμε περισσότερο αποτελεσματικά και κυρίως ταχύτερα
Διαβάστε περισσότεραΣτις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver.
Στις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver. 37 Αφού καθορίσετε τα βασικά στοιχεία του νέου κανόνα css, όπως είδαµε στις προηγούµενες διαφάνειες,
Διαβάστε περισσότεραΟδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!).
Εργαστήριο #8 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε
Διαβάστε περισσότεραCSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML
CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML Εισαγωγή Το CSS (Cascading Style Sheets ή Επικαλυπτόμενα Φύλλα Στυλ) μας επιτρέπει να αλλάξουμε τον τρόπο με τον οποίο παρουσιάζονται τα στοιχεία
Διαβάστε περισσότεραΕργαστήριο #9 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. βεβαιωθείτε ότι έχετε ολοκληρώσει τις προηγούμενες ασκήσεις Οδηγίες
Εργαστήριο #9 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε
Διαβάστε περισσότεραΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ. Κειμενογράφος WORD
ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ Κειμενογράφος WORD ΣΚΟΠΟΣ Η ανάπτυξη δεξιοτήτων επεξεργασίας κειμένου ΠΡΟΤΑΣΕΙΣ ΚΑΙ ΡΥΘΜΙΣΕΙΣ Άνω περιθώριο (top margin) : 2.49cm Κάτω περιθώριο (bottom margin) :5.99cm Αριστερό περιθώριο
Διαβάστε περισσότεραΕμφάνιση και κρύψιμο στοιχείων
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #8 0 : Δυναμικά εφέ με χρήση CSS Γαβαλάς Δαμιανός dgavalas@aegean.gr Εμφάνιση και κρύψιμο στοιχείων Χρήση της ιδιότητας display με επιτρεπτές τιμές: none: κρύψιμο του στοιχείου
Διαβάστε περισσότεραCascading Style Sheets
Cascading Style Sheets CSS είναι το ακρωνύµιο του Cascading Style Sheets (Επικαλυπτόµενα φύλλα στυλ). CSS είναι µια γλώσσα style δηλ. µια γλώσσα η οποία καθορίζει τη εµφάνιση HTML εγγράφων. Για παράδειγµα,
Διαβάστε περισσότεραΕισαγωγή στο CSS Από: Λία Βέρου
Εισαγωγή στο CSS Από: Λία Βέρου Τι είναι το CSS (Cascading Style Sheets); To CSS είναι μια απλή γλώσσα που μας βοηθάει να ορίσουμε με σαφήνεια και ιδιαίτερη ευελιξία τον τρόπο με τον οποίο θα εμφανίζονται
Διαβάστε περισσότεραΠοιες είναι οι κύριες ετικέτες που χρησιμοποιεί η HTML για την περιγραφή της συνολικής δομής μιας ιστοσελίδας;
Τι είναι η HTML; Η HTML είναι το ακρωνύμιο των λέξεων HyperText Markup Language, δηλαδή Γλώσσα Χαρακτηρισμού Υπερ Κειμένου και βασίζεται στη γλώσσα SGML, Standard Generalized Markup Language, που είναι
Διαβάστε περισσότεραΣΗΜΑΣΙΟΛΟΓΙΚΟΣ ΙΣΤΟΣ - XML
ΠΑΝΕΠΙΣΤΗΜΙΟ ΠΕΙΡΑΙΩΣ ΤΜΗΜΑ ΨΗΦΙΑΚΩΝ ΣΥΣΤΗΜΑΤΩΝ ΣΗΜΑΣΙΟΛΟΓΙΚΟΣ ΙΣΤΟΣ - XML Εργαστήριο 4 Στουγιάννου Ελευθερία estoug@unipi.gr Περιεχόμενα Τέταρτου Εργαστηριακού Μαθήματος XML CSS (CASCADING STYLE SHEETS)
Διαβάστε περισσότεραΗTML και XHTML Βασικές. Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας
ΗTML και XHTML Βασικές έννοιες Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας Η γραμματική της ΗΤML Όπως κάθε γλώσσα έχει μια γραμματική
Διαβάστε περισσότεραΕΠΛ 012. ιαδοχικά Φύλλα Στυλ
ΕΠΛ 012 ιαδοχικά Φύλλα Στυλ Cascading Style Sheets (CSS) Φύλλα Στυλ Μηχανισµός καθορισµού και τροποποίησης µορφοποίησης εγγράφων από τους συγγράφεις Πιο γενικός τρόπος από το καθορισµό όλων των χαρακτηριστικών
Διαβάστε περισσότεραΠίνακες. ετικέτα <table>
Πίνακες ετικέτα σύνταξη κελί 1 κελί 2 κελί 3 κελί 4 : πίνακας : γραμμή : κελί Ιδιότητα border border : ορίζει
Διαβάστε περισσότεραΜΑΘΗΜΑ Στοίχιση Παραγράφων. 2. Εσοχές Παραγράφων ΣΤΟΧΟΙ:
ΜΑΘΗΜΑ 4 ΣΤΟΧΟΙ: 1. Στοίχιση Παραγράφων 2. Εσοχές Παραγράφων 3. Διάστημα Μεταξύ Γραμμών (Διάστιχο) 4. Απόσταση Μεταξύ Παραγράφων 5. Καθορισμός Στηλοθετών (Tabs) 6. Μετακίνηση Στηλοθετών 7. Διαγραφή Στηλοθετών
Διαβάστε περισσότεραΕισαγωγή στο CSS Από: Μιχαήλια Κομβούτη Βέρου
Εισαγωγή στο CSS Από: Μιχαήλια Κομβούτη Βέρου Τι είναι το CSS (Cascading Style Sheets); To CSS είναι μια απλή γλώσσα που μας βοηθάει να ορίσουμε με σαφήνεια και ιδιαίτερη ευελιξία τον τρόπο με τον οποίο
Διαβάστε περισσότεραΠληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II Εισαγωγή Εικόνων Οι φυλλομετρητές μπορούν να εμφανίσουν ένθετες
Διαβάστε περισσότεραΣχεδίαση και Ανάπτυξη Ιστότοπων
Σχεδίαση και Ανάπτυξη Ιστότοπων HTML Καθορισμός Χρωμάτων και Γραμματοσειρών σε μια ιστοσελίδα Παρουσίαση 7 η Βελώνης Γεώργιος Καθηγητής 1 Σημασία συμβόλων HTML5 tags. Obsolete tags: Μην αφήνετε αυτές τις
Διαβάστε περισσότερα«Εθαξκνγέο Δηαδηθηύνπ»
«Εθαξκνγέο Δηαδηθηύνπ» CSS Μνξθνπνίεζε θαη Δηάηαμε κε ζηπι http://www.elizabethcastro.com/html5ed/examples/#c10 http://www.elizabethcastro.com/html5ed/examples/#c11 Πίλαθεο http://www.elizabethcastro.com/html5ed/examples/#c14
Διαβάστε περισσότεραΣημασιολογικός Ιστός (Semantic Web) - XML
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Σημασιολογικός Ιστός (Semantic Web) - XML 8/11/2016 Δρ. Ανδριάνα Πρέντζα Αναπληρώτρια Καθηγήτρια aprentza@unipi.gr Πανεπιστήμιο Πειραιά Τμήμα Ψηφιακών Συστημάτων
Διαβάστε περισσότεραΠίνακες HTML. Παναγιώτης Γαλάτης 1ο ΕΠΑΛ Ηρακλείου
Πίνακες HTML Παναγιώτης Γαλάτης 1ο ΕΠΑΛ Ηρακλείου Τι είναι Πίνακας Ένας πίνακας στοιχείων αποτελείται από γραμμές και στήλες. Το σημείο τομής μιας γραμμής και μιας στήλης ονομάζεται κελί (cell( cell).
Διαβάστε περισσότεραΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ
ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ Βαγγελιώ Καβακλή Τμήμα Πολιτισμικής Τεχνολογίας & Επικοινωνίας 8 Μαρτίου 2001 Hypertext Markup Language (HTML)! Σε μια ιστοσελίδα μπορούν να εμφανίζονται διαφορετικά
Διαβάστε περισσότεραΕΠΛ 003: ΕΠΙΣΤΗΜΗ ΤΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΚΑΙ ΠΛΗΡΟΦΟΡΙΑΚΑ ΣΥΣΤΗΜΑΤΑ HTML
ΕΠΛ 003: ΕΠΙΣΤΗΜΗ ΤΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΚΑΙ ΠΛΗΡΟΦΟΡΙΑΚΑ ΣΥΣΤΗΜΑΤΑ HTML Στόχοι 1 Να δημιουργήσουμε υπερκείμενα με την Γλώσσα Επισημείωσης Υπερκειμένων (hypertext markup language, HTML). Υπολογιστικά συστήματα:
Διαβάστε περισσότεραΕπαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML
Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο για το αρχείο Ορίζει το σώµα της background URL
Διαβάστε περισσότεραΤεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML)
Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML) 1. Δημιουργία μιας απλής σελίδας HTML Ανοίξτε το Notepad ακολουθώντας τη διαδρομή Start All Programs Accessories Notepad Πληκτρολογήστε το ακόλουθο κείμενο:
Διαβάστε περισσότεραΤεχνολογίες Διαδικτύου - Εργαστήριο 1 ο
Τεχνολογίες Διαδικτύου - Εργαστήριο 1 ο 1. Δημιουργία μιας απλής σελίδας HTML Στον προσωπικό σας κατάλογο δημιουργήστε ένα φάκελο με όνομα HTML. Ανοίξτε το Notepad ακολουθώντας τη διαδρομή (Start All Programs
Διαβάστε περισσότεραΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 2o ΕΡΓΑΣΤΗΡΙΟ ΜΟΡΦΟΠΟΙΗΣΗ ΣΤΗΝ HTML
ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ ΠΕΡΙΕΧΟΜΕΝΟ ΜΑΘΗΜΑΤΟΣ 2o ΕΡΓΑΣΤΗΡΙΟ ΜΟΡΦΟΠΟΙΗΣΗ ΣΤΗΝ HTML 1. Μορφοποίηση κειμένου Ετικέτες στυλ 2. Ιδιότητες ετικετών 3. Λίστες 4. Υπερσυνδέσεις
Διαβάστε περισσότεραTEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
Διαβάστε περισσότερα1. Κλικ στην καρτέλα Insert 2. Tables 3. Κλικ Table 4. Σύρουμε το δείκτη του ποντικιού και επιλέγουμε τον επιθυμητό αριθμό γραμμών και στηλών
ΜΑΘΗΜΑ 4 ΣΤΟΧΟΙ: 1. Προσθήκη Πίνακα (Table) 2. Εισαγωγή Και Μετακίνηση Κειμένου Σε Πίνακα 3. Εισαγωγή Στηλών Και Γραμμών Σε Πίνακα 4. Διαγραφή Στηλών Και Γραμμών Σε Πίνακα 5. Αλλαγή Πλάτους Στηλών Και
Διαβάστε περισσότερα1 ο ΓΥΜΝΑΣΙΟ ΘΕΡΜΗΣ ΜΟΡΦΟΠΟΙΗΣΕΙΣ ΜΟΡΦΟΠΟΙΗΣΕΙΣ ΧΑΡΑΚΤΗΡΩΝ. Μάθημα: Πληροφορική Α' Γυμν. Ενότητα: Επεξεργασία κειμένου
1 ο ΓΥΜΝΑΣΙΟ ΘΕΡΜΗΣ Μάθημα: Πληροφορική Α' Γυμν. Ενότητα: Επεξεργασία κειμένου ΜΟΡΦΟΠΟΙΗΣΕΙΣ Τα κυριότερα είδη μορφοποιήσεων είναι: Μορφοποιήσεις Χαρακτήρων Μορφοποιήσεις Παραγράφων Οι Μορφοποιήσεις Χαρακτήρων
Διαβάστε περισσότεραΣχεδόν όλες οι ιστοσελίδες βασίζονται σε μεγάλο βαθμό σε πίνακες. Για να εισάγουμε έναν πίνακα επιλέγουμε από το μενού Insert->Table.
DreamWeaver - Άσκηση 4η Πίνακες Παρακάτω θα δούμε πως μπορούμε να δημιουργούμε και να επεξεργαζόμαστε πίνακες, μια πολύ βασική δομή. Θα δούμε πως γίνεται εισαγωγή πίνακα, ένωση κελιών του πίνακα, προσθήκη
Διαβάστε περισσότεραCoding Bootcamp. Εισαγωγή στo CSS
Εισαγωγή στo CSS CSS (Cascading Style Sheets) Η Html σχεδιάστηκε αρχικά για να προβάλλει κείμενο και είχε σκοπό να «ορίσει» το περιεχόμενο μιας σελίδας υπό την έννοια ποιο κείμενο είναι επικεφαλίδα, ποιο
Διαβάστε περισσότεραΣχεδιασμός και Ανάπτυξη Ιστοσελίδων ΙΙ ΙΕΚ ΤΡΙΑΝΔΡΙΑΣ ΓΡΑΦΙΣΤΑΣ ΕΝΤΥΠΟΥ ΚΑΙ ΗΛΕΚΤΡΟΝΙΚΩΝ ΜΕΣΩΝ. CSS - Cascading Style Sheets
Σχεδιασμός και Ανάπτυξη Ιστοσελίδων ΙΙ ΙΕΚ ΤΡΙΑΝΔΡΙΑΣ ΓΡΑΦΙΣΤΑΣ ΕΝΤΥΠΟΥ ΚΑΙ ΗΛΕΚΤΡΟΝΙΚΩΝ ΜΕΣΩΝ CSS - Cascading Style Sheets Τι είναι τα CSS; Τα CSS (Διαδοχικά Φύλλα Στυλ) αποτελούν ένα πολύ καλό εργαλείο
Διαβάστε περισσότεραΠρογραμματισμός Διαδικτύου Ασκήσεις Εργαστηρίου
Προγραμματισμός Διαδικτύου Ασκήσεις Εργαστηρίου Ενότητα: ΕΡΓΑΣΤΗΡΙΑΚΗ ΑΣΚΗΣΗ Νο 03 Δρ. Μηνάς Δασυγένης mdasyg@ieee.org Τμήμα Μηχανικών Πληροφορικής και Τηλεπικοινωνιών Εργαστήριο Ψηφιακών Συστημάτων και
Διαβάστε περισσότεραΕισαγωγή στην Επιστήμη Υπολογιστών. Εισαγωγή στην HTML. Άννα Κεφάλα Παναγιώτα Μιχόλια
Εισαγωγή στην Επιστήμη Υπολογιστών Εισαγωγή στην HTML Άννα Κεφάλα Παναγιώτα Μιχόλια Εργαστηριακές Σημειώσεις ΕΙΣΑΓΩΓΗ ΣΤΗ ΓΛΩΣΣΑ HTML ΜΕΡΟΣ Β': CSS ΚΑΙ FORMS 2 Cascading Style Sheets (CSS) Cascading Style
Διαβάστε περισσότεραΑΣΠΑΙΤΕ. ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ 4α. Υπερκείμενο και HTML. Ημερομηνία :... Τμήμα :... Ονοματεπώνυμο :...
ΠΡΑΚΤΙΚΗ ΑΣΚΗΣΗ 4α Υπερκείμενο και HTML ΑΣΠΑΙΤΕ Ημερομηνία :... Τμήμα :... Ονοματεπώνυμο :... Η HTML (HyperText Markup Language) είναι η γλώσσα που χρησιμοποιείται για να περιγράψει τη δομή και τη διαμόρφωση
Διαβάστε περισσότεραΝέες Τεχνολογίες στην Εκπαίδευση
Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Μορφοποίηση κειμένου Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης Το παρόν εκπαιδευτικό
Διαβάστε περισσότεραΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ. 4o ΕΡΓΑΣΤΗΡΙΟ ΕΙΚΟΝΕΣ ΣΤΗΝ HTML
ΕΡΓΑΣΤΗΡΙΟ: ΤΕΧΝΟΛΟΓΙΕΣ ΠΛΗΡΟΦΟΡΙΑΣ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΣ ΣΤΟΝ ΤΟΥΡΙΣΜΟ ΠΕΡΙΕΧΟΜΕΝΟ ΜΑΘΗΜΑΤΟΣ 1. Εικόνες 2. Ασκήσεις 4o ΕΡΓΑΣΤΗΡΙΟ ΕΙΚΟΝΕΣ ΣΤΗΝ HTML 1. Εικόνες 1. Οι μορφές (format) των εικόνων που μπορείτε
Διαβάστε περισσότεραΕΠΛ 012. Φύλλα Στυλ (ΙΙ)
ΕΠΛ 012 Φύλλα Στυλ (ΙΙ) Τροποποίηση χρωµάτων Color: "όνοµα χρώµατος" rgb (rr,gg,bb) #RRGGBB RGB συνιστώσες όπου rr,gg,bb είναι ακέραιοι από το 0 255 H1 {color: rgb(255,0,0)} κόκκινες επικεφαλίδες background-colorcolor
Διαβάστε περισσότερα<HTML> <HEAD> <TITLE> <BODY>
ΑΣΚΗΣΗ 1 1. Ανοίξτε τον επεξεργαστή ιστοσελίδων 2. Αποθηκεύστε στο X:/mathimata/html/askiseis/ με όνομα askisi1b.html 3. Θα φτιάξουμε μια νέα ιστοσελίδα, χρησιμοποιώντας τις βασικές ετικέτες
Διαβάστε περισσότεραΣχεδίαση ιστοσελίδων
Τ.Ε.Ι. Δυτικής Ελλάδας Σχολή Διοίκησης και Οικονομίας Τμήμα Διοίκησης Επιχειρήσεων - Πάτρα Σχεδίαση ιστοσελίδων Θεώνη Πιτουρά, Γιάννης Κουτσονίκος Σημειώσεις για το Εργαστήριο «Επιχειρηματικές δικτυακές
Διαβάστε περισσότεραΕπεξεργαστής Κειμένου: (Microsoft Word)
Επεξεργαστής Κειμένου: (Microsoft Word) Στο περιβάλλον εργασίας του επεξεργαστή κειμένου Microsoft Word εκτελούμε τις παρακάτω λειτουργίες: 1) Δημιουργία Νέου Εγγράφου: Η Δημιουργία ενός Νέου Εγγράφου
Διαβάστε περισσότερα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 απαιτεί από τον Υποψήφιο να κατανοεί τις κύριες έννοιες της σχεδίασης και δημοσίευσης δικτυακών
Διαβάστε περισσότεραHyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου.
Hyper Text Markup Language (HTML) που σημαίνει γλώσσα σήμανσης υπερκειμένου. 1 η ΑΣΚΗΣΗ Οι HTML σελίδες είναι απλές σελίδες κειμένου και μπορούν να δημιουργηθούν από οποιοδήποτε πρόγραμμα επεξεργασίας
Διαβάστε περισσότεραΣε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας
Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας µέσω της τεχνολογίας των ιαδοχικών Φύλλων Στυλ (cascading
Διαβάστε περισσότεραΒασίλειος Κοντογιάννης ΠΕ19
Ενότητα3 Επικοινωνία και Διαδίκτυο 11.1 Γενική Εισαγωγή στην HTML Τι είναι η HTML (HyperText Markup Language); Είναι μια γλώσσα σήμανσης (Markup) με την οποία πραγματοποιείται η δόμηση σελίδων του Παγκόσμιου
Διαβάστε περισσότεραΚεφάλαιο 4 HyperText Markup Language - HTML. Προγραμματιστικά εργαλεία για το διαδίκτυο Φίλιππος Κουτσάκας, Πολύγυρος 2013
Κεφάλαιο 4 HyperText Markup Language - HTML Προγραμματιστικά εργαλεία για το διαδίκτυο Φίλιππος Κουτσάκας, Πολύγυρος 2013 Τι είναι η HTML; Ένας τρόπος για να πεις στον σελιδομετρητή πώς να αναπαραστήσει
Διαβάστε περισσότεραΣτοιχεία ορισμού θέσης (Positioning Elements)
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #7 0 : Ορισμός θέσης σε διατάξεις (positioned layouts). Γαβαλάς Δαμιανός dgavalas@aegean.gr Στοιχεία ορισμού θέσης (Positioning Elements) Οι ιδιότητες τοποθέτησης των CSS
Διαβάστε περισσότεραΕισαγωγη στην html. Η δομή μιας ιστοσελίδας (αρχείο html) Η βασική δομή ενός αρχείου html είναι η εξής: <html> <head>
Εισαγωγη στην html Ο παγκόσμιος ιστός (αγγ.: World Wide Web ή www) είναι η πιο δημοφιλής υπηρεσία που μας παρέχει το Διαδίκτυο (Internet) και είναι ένα σύστημα διασυνδεδεμένων πληροφοριών (κειμένου, εικόνας,
Διαβάστε περισσότεραΒαρβάκειο Πρότυπο Γυμνάσιο
Παραδόσεις & εργαστηριακές ασκήσεις στην HTML Βαρβάκειο Πρότυπο Γυμνάσιο Σχολ. Χρονιά 2017-2018 Θ. Οτζάκογλου Εργαστήρι Πληροφορικής Σχολ. Έτος 2016 2017 Αν και δεν είναι μία ακόμη «γλώσσα προγραμματισμού»,
Διαβάστε περισσότεραΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ
ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ Κεφάλαιο 4. Η γλώσσα HTML Επιμέλεια: Καραγιάννης Σπύρος Καθηγητής ΠΕ19 Βασικοί κανόνες σύνταξης HTML ομή σελίδας HTML Μορφοποίηση κειμένου Κατάλογοι Εισαγωγή
Διαβάστε περισσότεραΣχεδιασμός και Ανάπτυξη Ιστοτόπων. ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος
Σχεδιασμός και Ανάπτυξη Ιστοτόπων ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος H γλώσσα HTML Άλλες Βιβλιογραφικές πηγές για HTML http://www.w3schools.com/html/ http://www.it.uom.gr/project/html2/lessons.html
Διαβάστε περισσότεραΜΑΘΗΜΑ 5 ΣΤΟΧΟΙ: Τρόπος 1:
ΜΑΘΗΜΑ 5 ΣΤΟΧΟΙ: 1. Εισαγωγή Εικόνας 2. Εισαγωγή Αρχείου Γραφικού 3. Εισαγωγή Αυτόματου Σχήματος 4. Τροποποίηση Γραφικών Αντικειμένων 5. Αλλαγή Μεγέθους Γραφικού Αντικειμένου 6. Περιστροφή Γραφικού Αντικειμένου
Διαβάστε περισσότεραΠαρουσίαση και μορφοποίηση κειμένου
HTML [ετικέτες] Παρουσίαση και μορφοποίηση κειμένου Στην HTML σύμφωνα με τους κανόνες, κενές γραμμές και περισσότερα του ενός κενά μεταξύ λέξεων δεν λαμβάνονται υπόψη από τον φυλλομετρητή. Για αυτό το
Διαβάστε περισσότεραΑλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς
3.3.1.1 Αλλαγή της εμφάνισης κειμένου: μέγεθος γραμματοσειράς, είδος γραμματοσειράς Γραμματοσειρές Η λέξη γραμματοσειρά αναφέρεται στο στυλ που εμφανίζονται τα γράμματα. Παρακάτω ακολουθούν κάποια παραδείγματα,
Διαβάστε περισσότεραΒαρβάκειο Πρότυπο Γυμνάσιο
Παραδόσεις & εργαστηριακές ασκήσεις στην HTML Βαρβάκειο Πρότυπο Γυμνάσιο Σχολ. Χρονιά 2016-2017 Θ. Οτζάκογλου Εργαστήρι Πληροφορικής Σχολ. Έτος 2016 2017 Αν και δεν είναι μία ακόμη «γλώσσα προγραμματισμού»,
Διαβάστε περισσότεραΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΣΧΟΛΙΚΟ ΒΙΒΛΙΟ ΚΕΦΑΛΑΙΟ 11 Ευάγγελος Χ. Ζιούλας (Καθηγητής Πληροφορικής)
http://www.zioulas.gr ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΣΧΟΛΙΚΟ ΒΙΒΛΙΟ ΚΕΦΑΛΑΙΟ 11 Ευάγγελος Χ. Ζιούλας (Καθηγητής Πληροφορικής) WEB SERVER Είναι μια εφαρμογή software που αναλαμβάνει την αποστολή μιας ιστοσελίδας σε
Διαβάστε περισσότερα11. Η γλώσσα HTML Πίνακες, Λίστες, Φόρμες
11. Η γλώσσα HTML Πίνακες, Λίστες, Φόρμες Σκοπός του Εργαστηρίου: Σκοπός της παρούσας εργαστηριακής άσκησης είναι η εμβάθυνση σε συχνά χρησιμοποιούμενες ετικέτες HTML, όπως οι πίνακες και οι λίστες, καθώς
Διαβάστε περισσότεραTEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
Διαβάστε περισσότερα