CSS – Cascading Style Sheets (Φύλλα επάλληλων στυλ) Κανόνες που καθορίζουν τη μορφή και τη διάταξη των στοιχείων των σελίδων (X)HTML Σκοπός είναι ο διαχωρισμός.

Slides:



Advertisements
Παρόμοιες παρουσιάσεις
Τεχνολογίες Web Απαραίτητες γνώσεις για την υλοποίηση της άσκησης.
Advertisements

Εργαστήριο 17 Εκπαιδευτικό Εργαστήριο Πληροφορικής Χειμερινό Εξάμηνο 2006 Οικονομικό Πανεπιστήμιο Αθηνών Τμήμα Διοικητικής Επιστήμης & Τεχνολογίας.
Μορφοποίηση Χαρακτήρων
Πίνακες.
Να περιγράψετε τους 2 τρόπους οργάνωσης Ιστοσελίδων
Προγραμματισμός Διαδικτύου Δρ. Παναγιώτης Συμεωνίδης Διεπαφή Εφαρμογής Παγκόσμιου Ιστού (Front End Programming)
Επιμέλεια: Δέγγλερη Σοφία
Η γλώσσα μορφοποίησης υπερκειμένου HTML
Δ.Π.Θ. Επεξεργασία Κειμένου - 1 Επεξεργασία Κειμένου Ένα πρόγραμμα σε γλώσσα HTML είναι ανεξάρτητο της μηχανής όπου θα εκτελεστεί. Δηλαδή αγνοούνται τα.
HTML.
Επεξεργασία Κειμένου Ονομ/νυμο Επιμορφωτή Επιμορφωτής: Ονομ/νυμο Επιμορφωτή ΥΠΕΠΘ ΠΑΙΔΑΓΩΓΙΚΟ ΙΝΣΤΙΤΟΥΤΟ ΠΡΟΓΡΑΜΜΑ «ΚΟΙΝΩΝΙΑ ΤΗΣ ΠΛΗΡΟΦΟΡΙΑΣ» ΕΠΙΜΟΡΦΩΣΗ.
Επιμέλεια: Δέγγλερη Σοφία
Σύνταξη CELL(Είδος πληροφορίας; Κελί)
Επεξεργασία Κειμένου Ονομ/νυμο Επιμορφωτή Επιμορφωτής: Ονομ/νυμο Επιμορφωτή ΥΠΕΠΘ ΠΑΙΔΑΓΩΓΙΚΟ ΙΝΣΤΙΤΟΥΤΟ ΠΡΟΓΡΑΜΜΑ «ΚΟΙΝΩΝΙΑ ΤΗΣ ΠΛΗΡΟΦΟΡΙΑΣ» ΕΠΙΜΟΡΦΩΣΗ.
Ανοικτά Ακαδημαϊκά Μαθήματα
Πάντειο Πανεπιστήμιο Κοινωνικών και Πολιτικών Επιστημών ΠΜΣ Δυνητικές κοινότητες Μάθημα: Εισαγωγικά Θέματα W.W.W. CSS CASCADING STYLE SHEETS ΑΠΟΔΟΣΗ ΕΚΦΡΑΣΤΙΚΟΥ.
CSS – Cascading Style Sheets (Ιδιότητες γραμματοσειράς - font)
CSS Cascading Style Sheets
A1A1 A2A2 A4A4 A3A3 Χρόνος Όγκος απορροής Βροχόπτωση.
Επεξεργασία Κειμένου Ονομ/νυμο Επιμορφωτή Επιμορφωτής: Ονομ/νυμο Επιμορφωτή ΥΠΕΠΘ ΠΑΙΔΑΓΩΓΙΚΟ ΙΝΣΤΙΤΟΥΤΟ ΠΡΟΓΡΑΜΜΑ «ΚΟΙΝΩΝΙΑ ΤΗΣ ΠΛΗΡΟΦΟΡΙΑΣ» ΕΠΙΜΟΡΦΩΣΗ.
Επιμορφωτής: Ονομ/νυμο Επιμορφωτή
MS Word Κεφάλαιο 3.
Ειδικά Θέματα Η/ΥΕργαστήριο 7 Χ. Καραγιαννίδης1/17 Γλώσσα HTML Εργαστήριο 7 Χαράλαμπος Καραγιαννίδης
HTML: Η ΓΛΩΣΣΑ ΤΟΥ WEB  Απλά αρχεία.  Περιέχουν εντολές και κείμενο μαζί. BROWSER.  Οι εντολές απευθύνονται στον BROWSER.  Καθορίζουν τον τρόπο εμφάνισης.
Η γλώσσα HTML Επιμέλεια: Δέγγλερη Σοφία. Υπερκείμενο Το δομικό χαρακτηριστικό του Παγκόσμιου Ιστού Ένα αρχείο Απλό κείμενο και υπερσύνδεσμοι.
Διαχείριση αντικειμένων ΠΡΟΓΡΑΜΜΑ ΕΠΙΜΟΡΦΩΣΗΣ ΣΥΝΤΑΞΗ ΕΓΓΡΑΦΩΝ ΜΕ ΕΠΕΞΕΡΓΑΣΤΕΣ ΚΕΙΜΕΝΟΥ.
Microsoft Excel 4.5 Μορφοποίηση Κίκα Χρυσοστόμου.
ΕΙΣΑΓΩΓΗ ΣΤΗΝ ΠΛΗΡΟΦΟΡΙΚΗ Κεφάλαιο 11 Eισαγωγή στην ανάπτυξη ιστοσελίδων με HMTL Γιώργος Γιαγλής.
Διδάσκοντας με τη βοήθεια του επεξεργαστή κειμένου.
CSS – Cascading Style Sheets (Ιδιότητες κειμένου - text)
Εισαγωγή στην κατασκευή δικτυακών τόπων. Εισαγωγή στην ενότητα.
Ιστοσελίδες -- Web-site. Εισαγωγή Στατικές ιστοσελίδες Δυναμικές ή Διαδραστικές ιστοσελίδες:  Ο τρόπος παρουσίασης και τα περιεχόμενά της ιστοσελίδας.
Τα Διαδοχικά Φύλλα Στυλ CSS
Τεχνολογίες δημοσίευσης στον παγκόσμιο ιστό Κωνσταντίνος Αλεξίου Κέρκυρα, Ιούνιος 2004 Ιόνιο Πανεπιστήμιο Τμήμα Αρχειονομίας – Βιβλιοθηκονομίας Π.Μ.Σ.
Η Γλώσσα Σήμανσης ΥπερΚειμένου HTML
Στυλ με συνέπεια. Cascading Style Sheets (CSS) Ποιόν σκοπό εξυπηρετούν ? 4 Τα "Στυλιστικά Φύλλα" σκοπό έχουν να επιδρούν στην εμφάνιση των σελίδων με.
Applets Εκμεταλλεύονται τo γραφικό υπόβαθρο που παρέχουν οι browsers, έχοντας έτσι τη δυνατότητα προβολής γραφικών και τη δυνατότητα υλοποίησης ενός γραφικού.
CSS – Cascading Style Sheets (Εξωτερική γραμμή, περιθώριο, ενδιάμεση απόσταση) Η εξωτερική γραμμή (outline) σχεδιάζεται γύρω από ένα στοιχείο της HTML,
CSS – Cascading Style Sheets (Το μοντέλο box) Κάθε στοιχείο της HTML περιέχεται σε ένα “κουτί” (box). Το μοντέλο box μας βοηθάει στο σχεδιασμό της ιστοσελίδας.
Eπικοινωνία Ανθρώπου Μηχανης
CSS – Cascading Style Sheets (Ιδιότητες φόντου - background) Καθορίζουν το φόντο των στοιχείων της HTML Χρώμα φόντου Φόντο εικόνας (τοποθέτηση εικόνας,
CSS – Cascading Style Sheets (μορφοποίηση πινάκων)
1Κεφάλαιο 4 Κανόνες Σύνταξης HTML Όλες οι ετικέτες εσωκλείονται μεταξύ των χαρακτήρων “ “. Κάθε τι που βρίσκεται μεταξύ των χαρακτήρων “ ”, αποτελεί σχόλιο.
CSS – Cascading Style Sheets (μορφοποίηση συνδέσμων) Οι σύνδεσμοι μπορεί να βρίσκονται σε μία από τέσσερις καταστάσεις: link(ένας κανονικός σύνδεσμος που.
HTML-PHP Καμπέρης Άρης Α.Μ. 763 Zaher Owda Α.Μ. 849.
HTML 3. Στόχος της ώρας Απαιτήσεις XHTML 1.0 Strict Ιδιότητα title HTML Entities Ετικέτα label Favicon «Κακές» ιδιότητες Παραδείγματα.
Ο Παγκόσμιος ιστός World Wide Web (WWW) Είναι μια υπηρεσία του Internet ΠΡΟΣΟΧΗ μην την ταυτίζουμε με το ιντερνέτ Αποτελείται από εκατομμύρια ιστοσελίδες.
ΠΡΙΝ ΞΕΚΙΝΗΣΟΥΜΕ Πράγματα που αξιολογείτε θετικά σε σχέση με το μάθημα του προηγούμενου τετραμήνου Πράγματα που θα μπορούσαν να βελτιωθούν.
ΠΛΗΡΟΦΟΡΙΚΗ Ι Τμήμα Λογιστικής ΤΕΙ Κρήτης Γιάννης Χρυσάκης
Προγραμματιστικά Εργαλεία για το Διαδίκτυο Κατασκευή Ιστοσελίδων 3 ο Κεφάλαιο Βελώνης Γεώργιος – Καθηγητής Πληροφορικής ΠΕ20.
Ευχρηστία και προσβασιμότητα σε Microsoft Office Word Οδηγίες, συμβουλές & παραδείγματα Ομάδα ανάπτυξης Ανοιχτών Ακαδημαϊκών Μαθημάτων Ανοικτά Ακαδημαϊκά.
ΠΛΗΡΟΦΟΡΙΚΗ Ι Τμήμα Λογιστικής ΤΕΙ Κρήτης Γιάννης Χρυσάκης
HTML/CSS: Εισαγωγή Θερινό Σχολείο, 14 – 20 Ιουλίου 2014 Γιώργος Φουρτούνης Μονάδα Αριστείας ΕΛ/ΛΑΚ ΤΕΙ Αθήνας.
Wikis Ο Cunningham εμπνεύστηκε τον όρο wiki από τα "wiki wiki", δηλαδή τα "γρήγορα" λεωφορεία πυκνών δρομολογίων στον αερολιμένα της Χονολουλού.
Μάθημα 9ο HTML.
Κεφαλαιο 11 ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML.
Σχεδίαση Διαφανειών Πρακτικός Οδηγός.
HTML - CSS Δίνεται παρακάτω ο κώδικας HTML μιας ιστοσελίδας
Εισαγωγή στην HTML ΚΕΦΑΛΑΙΟ 11.
CSS Cascading Style Sheets
ΑΝΑΠΤΥΞΗ ΕΦΑΡΜΟΓΗΣ ΣΕ ΔΙΑΔΙΚΤΥΑΚΗ ΠΛΑΤΦΟΡΜΑ
Cascading Style Sheets (CSS)
Εισαγωγή στην HTML ΚΕΦΑΛΑΙΟ 11.
Γ6.4 Μορφοποίηση Πινάκων και Πρωτεύον Κλειδί
θέμα δήλωση Γραφικό SmartArt με εικόνες σε κόκκινο φόντο
Λογισμικό Εφαρμογών/Επεξεργασία Κειμένου
Η Ιστοσελίδα της Α΄ Τάξης Αυτή η πολύ απλή σελίδα είναι φτιαγμένη
Λογισμικό Εφαρμογών/Επεξεργασία Κειμένου
Κεφάλαιο 11 Τροποποίηση φόρμας.
Εισαγωγή στη δημιουργία ιστοσελίδων Διδάσκων:
Μεταγράφημα παρουσίασης:

CSS – Cascading Style Sheets (Φύλλα επάλληλων στυλ) Κανόνες που καθορίζουν τη μορφή και τη διάταξη των στοιχείων των σελίδων (X)HTML Σκοπός είναι ο διαχωρισμός του κώδικα περιεχομένου (,, κ.λ.π.) από τον κώδικα μορφοποίησης ( κ.λ.π.) Αποθήκευση σε εξωτερικά αρχεία *.css για εφαρμογή σε πολλές σελίδες

CSS – Cascading Style Sheets (Εφαρμογή κανόνων στυλ) Προτεραιότητες: 1. στυλ γραμμής (inline style) 2. εσωτερικά στυλ (στην ετικέτα 3. εξωτερικά στυλ (σε αρχεία *.css) 4. εξορισμού επιλογές φυλλομετρητή

CSS – Cascading Style Sheets (Σύνταξη κανόνων στυλ) επιλογέας {ιδιότητα: τιμή} επιλογέαςτο στοιχείο(α) που θα μορφοποιηθεί ιδιότηταη ιδιότητα που θα αλλάξει (π.χ. το χρώμα) τιμήη τιμή που θα πάρει η ιδιότητα

CSS – Cascading Style Sheets (Παραδείγματα κανόνων στυλ) επιλογέας {ιδιότητα: τιμή} body {color: black}χρώμα κειμένου p {font-family: "sans serif"}τιμή δύο λέξεων σε εισαγωγικά (τύπος γραμματοσειράς) p {text-align:center;color:red}ταυτόχρονη ρύθμιση πολλών ιδιοτήτων (στοίχιση και χρώμα κειμένου) p { text-align: center; color: black; font-family: arial } πιο ευανάγνωστη σύνταξη κανόνων για ρύθμιση πολλών ιδιοτήτων (στοίχιση, χρώμα, τύπος γραμματοσειράς)

CSS – Cascading Style Sheets (Ομαδοποίηση επιλογέων) π.χ. h1, h2, h3, h4, h5, h6 { color: green } πολλαπλοί επιλογείς χωρισμένοι με κόμμα

CSS – Cascading Style Sheets (Επιλογέας τάξης – class) Επιλογέας τάξης – class p.right {text-align: right} p.center {text-align: center} Τίτλος Αυτή η παράγραφος θα είναι στοιχισμένη δεξιά. Αυτή η παράγραφος θα είναι κεντραρισμένη.

CSS – Cascading Style Sheets (Επιλογέας τάξης – class) Επιλογέας τάξης – class.center {text-align: center} Αυτός ο τίτλος θα είναι κεντραρισμένος Αυτή η παράγραφος θα είναι κεντραρισμένη

CSS – Cascading Style Sheets (Εφαρμογή στυλ σε στοιχείο με συγκεκριμένη τιμή ιδιότητας) Επιλογέας τάξης – class input [type=“text”] {background-color: blue} Όνομα χρήστη: Κωδικός πρόσβασης: </form

CSS – Cascading Style Sheets (Επιλογέας αναγνωριστικού – id) Επιλογέας τάξης – class h1#title1 {text-align: center; color: blue} p#prg1 {color: red} Αυτός ο τίτλος θα είναι μπλε και κεντραρισμένος Αυτή η παράγραφος θα είναι κόκκινη

CSS – Cascading Style Sheets (Σχόλια) /* Αυτό είναι σχόλιο. Τα σχόλια αγνοούνται από το φυλλομετρητή */ p { text-align: center; /* Κι αυτό είναι σχόλιο */ color: black; font-family: arial }