Προγραμματισμός Παγκόσμιου Ιστού
|
|
- Αἰνέας Ζάχος
- 5 χρόνια πριν
- Προβολές:
Transcript
1 Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Προγραμματισμός Παγκόσμιου Ιστού 4 η Διάλεξη Δημοσθένης Κυριαζής Δευτέρα 20 Μαρτίου 2017
2 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης CSS Εισαγωγή Ιεραρχία CSS Selectors Προτεραιότητα Κληρονομικότητα CSS Box Model Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 2
3 «Εικόνες» και περιγραφές Το figure element δε χρειάζεται να περιλαμβάνει εικόνες Μπορεί να περιλαμβάνει κώδικα, ηχητικά μέρη, βίντεο, κλπ Κάθε figure element μπορεί να έχει μόνο ένα figcaption Σύνταξη <figure> <img alt= University of Piraeus src= unipi_logo.jpeg width= 100 height= 100 /> <figcaption> </figcaption> </figure> University of Piraeus Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη
4 Επισήμανση αλλαγών Επισήμανση αλλαγών στο κείμενο με τα νέα elements της HTML5: ins (προσθήκη), del (διαγραφή), s (μη έγκυρο) Παράδειγμα <article> <p>some of the following may not be accurate any more, some may have been added and other deleted. <em>please confirm!</em></p> </article> <ul> </ul> <li><s>lectures 1 & 2, November 2013</s> DONE</li> <li>lecture 3, Wednesday </li> <li>lecture 4, <del>wednesday </del> <ins>monday </ins></li> <li>lecture 3, Wednesday </li> Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη
5 Meter element Χρησιμοποιείται για να προσδιορίσει την ποσοστιαία μεταβολή μιας τιμής Υποστηρίζει διάφορα attributes Value: Η μοναδική που απαιτείται καθώς ορίζει την τιμή που θα εμφανιστεί στο meter Min / max: Προεπιλεγμένες τιμές στο 0 και 1.0 Low / high / optimum: Χρησιμοποιούνται για να ορίσουν κομμάτια για τα συγκεκριμένα σημεία του meter Παραδείγματα <p>course completion status: <meter value="0.80">80%</meter></p> <p>lectures completed: <meter min="0" max="10" value="8">8 out of 10</meter></p> Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη
6 Ημερολόγιο και ώρα Δεν απαιτείται πλέον η χρήση JavaScript λόγω νέων μεθόδων εισαγωγής Input type date Επιλογή ημέρας από ημερολόγιο Π.χ. <input type="date" name="birthday"> Input type datetime Επιλογή ημερομηνίας και ώρας (βάσει UTC) Π.χ. <input type="datetime" name="bdaytime"> Input type datetime-local Επιλογή ημερομηνίας και ώρας (βάσει τοπικής ώρας) Input type month / week Επιλογή μήνα / εβδομάδας Π.χ. <input type="month" name="bdaymonth"> Χρήση attributes min και max για τον ορισμό ελάχιστων / μέγιστων τιμών (στη μορφή YYYY-MM-DD) Π.χ. <input type="date" name="birthday" min=" ">
7 Επιλογή αριθμών (1/2) Νέο input type number για την εισαγωγή / επιλογή αριθμού Δεν επιτρέπεται η εισαγωγή μη αριθμητικών χαρακτήρων Με τα min και max attributes μπορεί να ορισθεί συγκεκριμένο εύρος τιμών Με το step attribute μπορεί να ορισθεί το βήμα Π.χ. <input type="number" id="numberitem" name="numberitem" min="1" max="10" step="2" /> Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη
8 Επιλογή αριθμών (2/2) Νέο input type range για την επιλογή αριθμού Δεν υπάρχει πεδίο εισαγωγής αριθμού min, max, and step attributes. Εμφάνιση Περιορισμένες επιλογές (εμφάνιση κυρίως βάσει των browser) Εισαγωγή τιμών height και width Π.χ. Εάν το height είναι μεγαλύτερο του width εμφανίζεται κατακόρυφα HTML: <input type="range" id="range" name="range" min="0" max="10" step="1" /> CSS: #range { -webkit-appearance: slider-vertical; width: 20px; height: 100px; } Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη
9 Video element (1/2) To video element χρησιμοποιείται για την εισαγωγή αποσπασμάτων βίντεο στις σελίδες Υποστηρίζει διάφορα attributes src: Ορίζει το αρχείο αναπαραγωγής poster: Ορίζει την εικόνα που θα εμφανίζεται όσο «κατεβαίνει» το βίντεο ή μέχρι ο χρήστης να επιλέξει την αναπαραγωγή του width, height: Ορίζουν το μέγεθος του player σε pixels controls: Ορίζει αν θα εμφανίζονται στοιχεία ελέγχου (προεπιλογή να μην εμφανίζονται) autoplay: Ορίζει αν θα αρχίσει αυτόματα η αναπαραγωγή loop: Ορίζει αν θα επαναλαμβάνεται η αναπαραγωγή όταν ολοκληρωθεί preload: Ορίζει τι να κάνει ο browser αν δεν έχει επιλεγεί autoplay. Μπορεί να λάβει τιμές: none: Ο browser δεν αναπαράγει το βίντεο μέχρι ο χρήστης να το επιλέξει auto: Ο browser «κατεβάζει» το βίντεο όταν «φορτώσει» η σελίδα metadata: Ο browser απλά αποθηκεύει πληροφορία αναφορικά με το μέγεθος, την πρώτη εικόνα και τη διάρκεια
10 Video element (2/2) Παράδειγμα <video src="video.mp4" poster="logo.jpeg" width="400" height="300" preload controls loop> <p>this browser doesn't support the specific video format.</p> </video> Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη
11 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης CSS Εισαγωγή Ιεραρχία CSS Selectors Προτεραιότητα Κληρονομικότητα CSS Box Model Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 11
12 Σύνταξη CSS Η σύνταξη CSS αποτελείται από 3 τμήματα: selector, property και value selector {property:value} Ο selector είναι το element/tag που επιθυμούμε να ορίσουμε, το property είναι η παράμετρος που θέλουμε να αλλάξουμε και τέλος, το value η τιμή της Σχόλια σε /* Αυτό είναι ένα σχόλιο */ Εισαγωγή CSS σε url("layout.css"); Παραδείγματα: body {background-color:black} p {font-family:"sans serif";} "" εάν υπάρχουν περισσότερες λέξεις p {text-align:center; color:red;} ; εάν υπάρχουν περισσότερες παράμετροι h1,h2,h3,h4,h5,h6 {color:green;} ομαδοποίηση στοιχείων Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 12
13 Μονάδες στα CSS Measurement Values (τα πιο σημαντικά) % px pixel in inch cm centimeters mm milimeters em 1em ισοδυναμεί με ένα font size Color Values όνομα: π.χ. white, blue, green κτλ. rgb(x,x,x): π.χ. rgb(255,0,0) HEX: π.χ. #ff0000 Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 13
14 Γραμματοσειρές (1/3) HTML & CSS, Design and Build Websites, Jon Duckett Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 14
15 Γραμματοσειρές (2/3) HTML & CSS, Design and Build Websites, Jon Duckett Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 15
16 Γραμματοσειρές (3/3) HTML & CSS, Design and Build Websites, Jon Duckett Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 16
17 Fonts font-family: Μια λίστα με fonts για την περίπτωση όπου κάποιο font δεν είναι διαθέσιμο στο σύστημα του χρήστη π.χ. p {font-family:"times New Roman", Times, serif;} font-style: Το στυλ του font π.χ. p.normal {font-style:normal;} ή p.italic {font-style:italic;} font-size: Το μέγεθος του font. Μπορεί να πάρει και τιμές xx-small xx-large, smaller, larger π.χ. p {font-size:14px;} ή h1 {font-size:2.5em;} font-weight: Πόσο σκούρο είναι το font. Μπορεί να πάρει και τιμές , bolder, lighter π.χ. p.bold {font-weight:bold;} font-variant: Σε κάποιες γραμματοσειρές επιτρέπεται το small-caps π.χ. p.var {font-variant:small-caps;} Shortcut: font { font: style weight variant size font-family } π.χ. p {font: oblique bold small-caps 1.5em Verdana, Arial, sans-serif;} 17
18 Κείμενο text-align: Στοίχιση του κειμένου σε left, right, center, justify π.χ. p {text-align: justify;} text-transform: Μετατροπή του κειμένου σε uppercase, lowercase, capitalize π.χ. p.uppercase {text-transform:uppercase;} text-decoration: Παρουσίαση του κειμένου σε none, underline, overline, line-through π.χ. h2 {text-decoration:line-through;} letter-spacing, word-spacing: Αποστάσεις ανάμεσα στους χαρακτήρες και τις λέξεις αντίστοιχα text-indent: Διάστημα κειμένου από border π.χ. p#par1 { text-indent: 2em; } π.χ. p#par2 { text-indent: 25%; } π.χ. p#par3 { text-indent: -35px; } 18
19 Σύνδεσμοι Στα link μπορεί να αλλάζει η εμφάνιση των καταστάσεων που βρίσκονται a:link {color:#ff0000;} /* unvisited link */ a:visited {color:#00ff00;} /* visited link */ a:hover {color:#ff00ff;} /* mouse over link */ for rollover effects a:active {color:#0000ff;} /* selected link */ Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 19
20 Pseudo-elements Elements που παρέχουν συγκεκριμένη λειτουργία όπου εφαρμόζονται :first-line color, font, background, word-spacing, letter-spacing, text-decoration, vertical-align, text-transform, line-height :first-letter Color, font, text-decoration, text-transform, vertical-align, text-transform, background, margin, padding, border, float, letter-spacing, word-spacing :first-child :lang() π.χ. p:first-letter {font-size: 300%; color: orange;} π.χ. a:hover {color: maroon; text-decoration: underline; background-color: #C4CEF8; } <a href=" of Piraeus, Department of Digital Systems</a> 20
21 Backgrounds background-color: Το χρώμα του background π.χ. body {background-color:#b0c4de;} background-image: Μια εικόνα σαν background που μάλιστα μπορεί και να επαναλαμβάνεται π.χ. body {background-image: url('gradient.png'); background-repeat: repeat-x;} background-position: Η θέση του background. Μπορεί να πάρει τιμές left, center, right, top, bottom, ποσοστά και τιμές σε pixels π.χ. { background-position: 200px 50px; } Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 21
22 Εισαγωγή CSS σε HTML Εξωτερικό style sheet (χαμηλή προτεραιότητα) Χρήσιμα για πολλές σελίδες, έτσι αλλάζοντας το CSS αλλάζει ολόκληρο το web site ή για διαφορετικούς λόγους (screen, media, handheld, κλπ) Το CSS «φορτώνεται» με το <link> tag στο <head> της σελίδας <head> <link rel="stylesheet" href="/path/stylesheet.css" type="text/css" media="print"/> </head> Εσωτερικό style sheet - στο head (μεσαία προτεραιότητα) <head> <style type="text/css > h1 {color:black} p {margin-left:20px} body {background-image:url("images/back40.gif")} </style> </head> Inline style (υψηλή προτεραιότητα) <p style="color:black;margin-left:20px">this is a paragraph.</p> Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 22
23 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης CSS Εισαγωγή Ιεραρχία CSS Selectors Προτεραιότητα Κληρονομικότητα CSS Box Model Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 23
24 Ιεραρχία στα CSS Μπορούμε να δημιουργήσουμε πιο πολύπλοκα CSS που να αναφέρονται σε συγκεκριμένα στοιχεία της σελίδας Παράδειγμα.aclass h3 { } Aφορά όλα τα <h3> elements κάτω από element με class= aclass table.aclass tr {magrin:20px;} Aφορά όλα τα <tr> elements κάτω από element <table> με class= aclass Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 24
25 CSS Selectors Selector Σημασία Παράδειγμα Universal Selector Όλα τα elements της σελίδας * {} Type Selector Συγκεκριμένα elements της σελίδας h1, h2, h3 {} Class Selector Όλα τα elements (ή τα elements τύπου) που έχουν το συγκεκριμένο class attribute.note {} p.note {} ID Selector Όλα τα elements που έχουν το συγκεκριμένο attribute #introduction {} Child Selector Descendant Selector Μόνο τα elements που είναι «απ ευθείας παιδιά» ενός άλλου element (σε πρώτο επίπεδο) Όλα τα elements συγκεκριμένου τύπου που είναι «απόγονοι» ενός άλλου element li>a {} p a {} Adjacent Sibling Selector Το πρώτο element που ακολουθεί ένα άλλο element h1+p {} General Sibling Selector Όλα τα elements συγκεκριμένου τύπου που ακολουθούν ένα άλλο element h1~p {} Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 25
26 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης CSS Εισαγωγή Ιεραρχία CSS Selectors Προτεραιότητα Κληρονομικότητα CSS Box Model Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 26
27 Προτεραιότητα Εάν δύο selectors είναι ίδιοι, τότε εφαρμόζεται μόνο ο τελευταίος ( last one listed wins ) Εάν ένας selector είναι πιο συγκεκριμένος από κάποιον άλλο, τότε ο πιο συγκεκριμένος είναι αυτός που εφαρμόζεται π.χ. το h1 είναι πιο συγκεκριμένο από το * Εάν στο τέλος κάποιας ιδιότητας προσθέσουμε το!important, τότε η ιδιότητα αυτή θεωρείται πιο σημαντική από άλλους κανόνες που σχετίζονται με το συγκεκριμένο element. Cascading? Για την περίπτωση των conflicts! h1 {color: green!important;} <h1 style="color:yellow">cascading case</h1> Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 27
28 Κληρονομικότητα Οι περισσότερες από τις ιδιότητες που ορίζουμε σε γενικά elements, όπως το body, κληρονομούνται από όλα τα άλλα elements της σελίδας Εάν δηλώνεται font στο body δε χρειάζεται να οριστεί για τα p και h1 κτλ Με αυτό τον τρόπο αποφεύγουμε την επανάληψη κώδικα Με την τιμή inherit σε κάποια ιδιότητα, επιβάλλουμε να κληρονομήσει την τιμή της από τους προγόνους της <div class="page"> <h1>potatoes</h1> <p>there are dozens of different potato varieties.</p> <p>they are usually described as early, second early and maincrop potatoes.</p> </div> body {.page { font-family: Arial, Verdana, sans-serif; color: #665544; padding: 10px;} border: 1px solid #665544; background-color: #efefef; padding: inherit;} 28
29 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης CSS Εισαγωγή Ιεραρχία CSS Selectors Προτεραιότητα Κληρονομικότητα CSS Box Model Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 29
30 CSS Box Model Αν θεωρήσουμε κάθε ένα html element σαν ένα κουτί (box) τότε στο css μπορούμε να ορίζουμε αντίστοιχα τις ακόλουθες παραμέτρους Margin : Η περιοχή γύρω από το border. Είναι διαφανή / transparent Border : Το πλαίσιο γύρω από το padding και το content Padding : Η περιοχή γύρω από το content. Έχει το χρώμα του background Content : Εδώ εμφανίζεται το κείμενο και οι εικόνες Παράδειγμα: width:250px; padding:10px; border:5px solid gray; margin:10px; Total width= 300px!! Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 30
31 Μέγεθος width, height: Tο μέγεθος της συγκεκριμένης περιοχής π.χ. div.mydiv {height: 300px; width: 50%;} min-width, min-height: Tο ελάχιστο μέγεθος της συγκεκριμένης περιοχής π.χ. div.mydiv {min-height: 300px; min-width: 300px;} max-width, max-height: Tο μέγιστο μέγεθος της συγκεκριμένης περιοχής π.χ. div.mydiv {max-height: 300px; max-width: 300px;} Overflow: Η ιδιότητα αυτή καθορίζει πως θα εμφανίζεται το κείμενο αν δε χωράει σε συγκεκριμένη περιοχή visible (default), hidden, scroll Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 31
32 Borders border-style: Δηλώνει τον τύπο του border. Μπορούν να δηλώνονται μεγέθη για κάθε πλευρά του border (border-top-style, border-right-style, border-bottom-style, border-left-style) π.χ. div.mydiv {border-style:solid;} border-width: Δηλώνει το μέγεθος του border. Μπορούν να δηλώνονται μεγέθη για κάθε πλευρά του border (border-top-width, border-rightwidth, border-bottom-width, border-left-width). Εκτός από απόλυτα μεγέθη μπορεί να πάρει τιμές: thin medium thick π.χ. div.mydiv {border-width:5px;} border-color: Δηλώνει το χρώμα του border π.χ. div.mydiv {border-color:red;} Οι ιδιότητες δηλώνονται είτε ξεχωριστά για κάθε πλευρά ή όλες μαζί π.χ. div.mydiv {border-left-color:red; border-right-style:dotted;} π.χ. div.mydiv {border:5px solid red;} Στα tables, η ιδιότητα border-collapse:collapse; ορίζει ότι τα borders των κελιών ταυτίζονται με τα borders των διπλανών τους Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 32
33 border-style p.none {border-style:none;} p.dotted {border-style:dotted;} p.dashed {border-style:dashed;} p.solid {border-style:solid;} p.double {border-style:double;} p.groove {border-style:groove;} p.ridge {border-style:ridge;} p.inset {border-style:inset;} p.outset {border-style:outset;} p.hidden {border-style:hidden;} Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 33
34 Padding Η ιδιότητα αυτή καθορίζει την απόσταση του περιεχομένου μιας περιοχής από το border της Ομοίως με το border μπορούν να ορίζονται με διαφορετικές αποστάσεις για κάθε πλευρά ή όλες μαζί padding-top:25px; padding-bottom:25px; padding-right:50px; padding-left:50px; padding:25px 50px; top/bottom = 25px, right/left = 50px padding:25px 50px 75px; top = 25px, right/left = 50px, bottom = 75px padding:25px 50px 75px 100px; top = 25px, right = 50px, bottom = 75px, left = 100px Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 34
35 Margin Η ιδιότητα αυτή καθορίζει το κενό γύρω από την περιοχή Ομοίως με το border και το padding μπορούν να ορίζονται διαφορετικές αποστάσεις για κάθε πλευρά ή όλες μαζί margin-top:25px; margin-bottom:25px; margin-right:50px; margin-left:50px; margin:25px 50px; top/bottom = 25px, right/left = 50px margin:25px 50px 75px; top = 25px, right/left = 50px, bottom = 75px margin:25px 50px 75px 100px; Σημειώσεις: top = 25px, right = 50px, bottom = 75px, left = 100px Τόσο για το padding όσο και για το margin είναι προτιμότερο να χρησιμοποιούνται τιμές «em» ώστε το μέγεθος να αλλάζει αντίστοιχα με το κείμενο Προσοχή τα margins μπορεί να συμπτυχθούν! Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 35
36 Position position:static: Η standard επιλογή των browsers όπου το περιεχόμενο ακολουθεί το ένα το άλλο position:relative: Τοποθετεί το περιεχόμενο σε σχέση με εκεί που θα έπρεπε με βάση την static επιλογή. Το αρχικό σημείο παραμένει κενό π.χ. div.content {position: relative; top:10px; left:100px; background-color: fuchsia;} position:absolute: Το περιεχόμενο δεν ακολουθεί τη ροή και δεν επηρεάζει τα άλλα στοιχεία της σελίδας π.χ. h1 { position: absolute; top: 0px; left: 500px;} position:fixed: Το περιεχόμενο τοποθετείται σε συγκεκριμένο σημείο του παραθύρου π.χ. h1 { position:fixed ; top: 0px; left: 0px;} Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 36
37 Relative βάσει containing block Όταν ένα element βρίσκεται «μέσα» σε κάποιο άλλο που έχει το position του relative, absolute, ή fixed, το element θα τοποθετηθεί με βάση το συγκεκριμένο element στο οποίο βρίσκεται p { } img { } position: relative; background-color: green; border: 2px solid black; position: absolute; bottom: 0%; right: 0%; Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 37
38 Float To float χρησιμοποιείται για να τοποθετούμε περιεχόμενο δεξιά (float:right) ή αριστερά (float:left) στη σελίδα μας και το υπόλοιπο περιεχόμενο να το «περικυκλώνει» Η επιλογή clear σταματά τα element να συνεχίσουν γύρω από ένα floating element, όπως για παράδειγμα όταν θέλω να έχω μια νέα γραμμή p#end {clear: left;} <p id="end"> </p> Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 38
39 Floating inline elements Υπάρχει η δυνατότητα ένα element να τοποθετείται παράλληλα με κάποιο άλλο inline element <span class="disclaimer">probably a disclaimer in the page.</span> span.disclaimer { } float: right; margin: 10px; width: 200px; color: white; background-color: red; padding: 4px; Σημείωση: Σε κείμενο πρέπει πάντα να δίνεται width Περιορίζεται στη συγκεκριμένη περιοχή Δε γίνεται collapse με άλλα elements Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 39
40 Floating block elements Η ιδιότητα των inline elements μπορεί να χρησιμοποιηθεί και για block elements <p id="float">this will be floating text...</p> #float { float: left; width: 200px; margin-top: 0px; background: #A5D3DE; } Σημείωση: Πρέπει πάντα να δίνεται width σε κείμενο Περιορίζεται στη συγκεκριμένη περιοχή Αυτός είναι ο σκοπός του floating Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 40
41 Cursor Μπορούμε να αλλάζουμε δυναμικά την εμφάνιση του cursor μέσα από το css π.χ. a{cursor: move;} Επιλογές auto crosshair default pointer move text wait help url("cursor.gif") Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 41
42 Reset css Οι διάφοροι browsers έχουν διαφορετικά αρχικά styles με αποτέλεσμα οι html σελίδες να εμφανίζονται ανομοιόμορφα Για να αντιμετωπιστεί αυτό το πρόβλημα έχουν δημιουργηθεί css styles που δημιουργούν ένα ομοιογενές περιβάλλον για την «υλοποίηση» συγκεκριμένων style Παραδείγματα: Eric Meyer s Reset CSS 2.0 Yahoo! (YUI 3) Reset CSS Πλήρης λίστα: Προγραμματισμός Παγκόσμιου Ιστού, 4η Διάλεξη 42
Προγραμματισμός Παγκόσμιου Ιστού
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Προγραμματισμός Παγκόσμιου Ιστού 5 η Διάλεξη Δημοσθένης Κυριαζής Δευτέρα 27 Μαρτίου 2017 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης CSS Ιεραρχία CSS Selectors
Διαβάστε περισσότεραΠρογραμματισμός Παγκόσμιου Ιστού
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Προγραμματισμός Παγκόσμιου Ιστού 3 η Διάλεξη Δημοσθένης Κυριαζής Δευτέρα 13 Μαρτίου 2017 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης HTML / HTML5 Εικόνες
Διαβάστε περισσότεραCSS. Cascading Style Sheets. Γλώσσες και Τεχνολογίες Ιστού Τμήμα Πληροφορικής - ΑΤΕΙ Θεσσαλονίκης
CSS Cascading Style Sheets CSS Τα Cascading Style Sheets ορίζουν τις ιδιότητες παρουσίασης των στοιχεία της HTML. Αρχικά η HTML δεν περιελάμβανε στοιχεία για την εμφάνιση / παρουσίαση της πληροφορίας αλλά
Διαβάστε περισσότεραCascading Style Sheets (CSS)
Cascading Style Sheets (CSS) Τα Cascading Style Sheets προσφέρουν έναν εύκολο τρόπο για να ορίσουμε τη μορφοποίηση που επιθυμούμε να έχουν οι σελίδες μία τοποθεσίας του Παγκόσμιου Ιστού που δημιουργούμε.
Διαβάστε περισσότεραΠρογραμματισμός Παγκόσμιου Ιστού
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Προγραμματισμός Παγκόσμιου Ιστού 11 η Διάλεξη Δημοσθένης Κυριαζής Δευτέρα 06 Ιουνίου 2016 Σημερινή διάλεξη Client-server programming HTML5 CSS Layouts Javascript
Διαβάστε περισσότεραΠρογραμματισμός Παγκόσμιου Ιστού
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Προγραμματισμός Παγκόσμιου Ιστού 7 η Διάλεξη Δημοσθένης Κυριαζής Δευτέρα 04 Απριλίου 2016 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης CSS Σύνοψη Ιεραρχία
Διαβάστε περισσότεραΠρογραμματισμός Παγκόσμιου Ιστού
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Προγραμματισμός Παγκόσμιου Ιστού 6 η Διάλεξη Δημοσθένης Κυριαζής Δευτέρα 3 Απριλίου 2017 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης CSS Positioning Responsive
Διαβάστε περισσότεραΔιάλεξη 2η Εισαγωγή στο CSS
Διάλεξη 2η Εισαγωγή στο CSS Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e c o d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Τι είναι το CSS? Γιατί να χρησιμοποιήσω
Διαβάστε περισσότεραΣτην τεχνολογία των CSS, οι κανόνες στυλ (style
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #4 0 : CSS: Βασικές και προχωρημένες τεχνικές επιλογής, τα στοιχεία και , ψευδο κλάσεις και ψευδο επιλογείς Γαβαλάς Δαμιανός dgavalas@aegean.gr CSS κανόνες στυλ
Διαβάστε περισσότεραEurope Code Week 7-22 Οκτωβρίου Μία γιορτή δημιουργίας με κώδικα
Europe Code Week 7-22 Οκτωβρίου 2017 7-22 October 2017 Μία γιορτή δημιουργίας με κώδικα @CodeWeekEU #codeeu codeeu Εισαγωγή στο Web Development CSS Λίγα λόγια... Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση
Διαβάστε περισσότεραΗ ΓΛΩΣΣΑ ΕΠΙΚΑΛΥΠΤΩΜΕΝΩΝ ΜΟΡΦΟΠΟΙΗΣΕΩΝ CSS
Η ΓΛΩΣΣΑ ΕΠΙΚΑΛΥΠΤΩΜΕΝΩΝ ΜΟΡΦΟΠΟΙΗΣΕΩΝ CSS Πίνακες Ιδιοτήτων Μορφοποίησης CSS Ιδιότητες Διαστασιολόγησης Στοιχείων height Ορίζει το ύψος ενός στοιχείου auto lenght (px) line-height Ορίζει το ύφος μιας
Διαβάστε περισσότερα<a href="http://www.somepage.com/somepage.html">μετάβαση στο κείμενο</a>.
HTML Τα αρχεία της HTML έχουν ετικέτες (tags) που ορίζουν τη δομή και τη μορφοποίηση των ιστοσελίδων. Οι περισσότερες HTML ετικέτες τις συναντούμε ως ζεύγη τα οποία ενεργούν στα περιεχόμενα μεταξύ των
Διαβάστε περισσότεραΗ γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή.
Εισαγωγή στο CSS Η γλώσσα CSS χρησιμοποιείται για τη μορφοποίηση ιστοσελίδων και η σύνταξη της είναι αρκετά απλή. Πλεονεκτήματα CSS έναντι χρήσης μόνο HTML Μεγαλύτερη ευελιξία μορφοποιήσεων. Το CSS κατέστησε
Διαβάστε περισσότεραΘέματα Προγραμματισμού Διαδικτύου ~ CSS ~
Θέματα Προγραμματισμού Διαδικτύου ~ CSS ~ Στελιος Σφακιανάκης Εαρινό 2019 Αυτή η εργασία χορηγείται με άδεια Creative Commons Αναφορά Δημιουργού - Μη Εμπορική Χρήση - Παρόμοια Διανομή 1 Εισαγωγή στο CSS
Διαβάστε περισσότεραΗ Βίβλος των CSS - Μέρος 3 Το Box Model, τα Περιθώρια και τα Περιγράμματα
Η Βίβλος των CSS - Μέρος 3 Το Box Model, τα Περιθώρια και τα Περιγράμματα Το Box Model Το box model στα CSS περιγράφει τα πλαίσια (boxes) που δημιουργούνται για τα στοιχεία (elements) της HTML. Το box
Διαβάστε περισσότεραΓλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης
CASCADING STYLE-SHEETS CASCADING STYLE-SHEETS Γλώσσα περιγραφής οδηγιών εµφάνισης-στοιχειοθέτησης εφαρµογών HTML. Τα CSS ορίζονται σε δύο συστάσεις του W3C: CSS1, εκ. 1996 περιλαµβάνει περίπου 50 ιδιότητες
Διαβάστε περισσότεραΓαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS)
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #3 0 : Εισαγωγή στacascading Style Sheets (CSS) Γαβαλάς Δαμιανός dgavalas@aegean.gr Επικαλυπτόμενα Φύλλα Στυλ (Cascading Style Sheets, CSS) Η (X)HTML προσδιορίζει τη βασική
Διαβάστε περισσότεραΠεριεχόμενα. Γαβαλάς Δαμιανός
Δικτυακά Πολυμέσα ΙΙ Διάλεξη #5 η : Τυπογραφία στο web Γαβαλάς Δαμιανός dgavalas@aegean.gr Περιεχόμενα Κατανόηση αρχών σχεδιασμού με γραμματοσειρές Κατανόηση των μονάδων μέτρησης που χρησιμοποιούνται στα
Διαβάστε περισσότεραΒαρβάκειο Πρότυπο Γυμνάσιο Εργαστήρι Πληροφορικής Σχολ. Έτος Φύλλο Εργασίας 5
Φύλλο Εργασίας 5 HTML: Χρήση των Cascading Style Sheets (CSS) για τον έλεγχο της εμφάνισης των στοιχείων της html Με τη χρήση CSS πετυχαίνουμε να ελέγξουμε περισσότερο αποτελεσματικά και κυρίως ταχύτερα
Διαβάστε περισσότεραΕργαλεία Ανάπτυξης Εφαρμογών Internet. Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής
Εργαλεία Ανάπτυξης Εφαρμογών Internet Δ.Ι.Ε.Κ. Γλυφάδας Τεχνικός Εφαρμογών Πληροφορικής Το πρότυπο CSS Α Μέρος 2 CSS (Cascading Style Sheets)(1) Ορίζουν την εμφάνιση των στοιχείων σε ένα έγγραφο HTML.
Διαβάστε περισσότεραCSS 3. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 3 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης
Διαβάστε περισσότεραΣχεδιασμός και Ανάπτυξη Ιστότοπων
Σχεδιασμός και Ανάπτυξη Ιστότοπων CSS: Ιδιότητες μορφοποίησης κειμένου Παρουσίαση 14 η 1 Βελώνης Γεώργιος Καθηγητής Browsers δοκιμών Οι δοκιμές έγιναν στους παρακάτω browsers και εκδόσεις τους: Google
Διαβάστε περισσότεραΔιάλεξη 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
Διαβάστε περισσότεραΕκπαιδευτικά Περιβάλλοντα Διαδικτύου
ΑΡΙΣΤΟΤΕΛΕΙΟ ΠΑΝΕΠΙΣΤΗΜΙΟ ΘΕΣΣΑΛΟΝΙΚΗΣ ΑΝΟΙΚΤΑ ΑΚΑΔΗΜΑΪΚΑ ΜΑΘΗΜΑΤΑ Εκπαιδευτικά Περιβάλλοντα Διαδικτύου Ενότητα 6: CSS Θρασύβουλος-Κωνσταντίνος Τσιάτσος Άδειες Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται
Διαβάστε περισσότεραCSS 2. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος. Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 2 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Π. Αγγελάτος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης
Διαβάστε περισσότεραCSS. Εισαγωγή & Βασικές έννοιες. Cascading Style Sheets. Επικαλυπτόμενα φύλλα στυλ
CSS Εισαγωγή & Βασικές έννοιες Cascading Style Sheets Επικαλυπτόμενα φύλλα στυλ Περιεχόμενα Τι είναι CSS Πλεονεκτήματα CSS μορφοποίησης Συντακτικό του CSS Ιδιότητες CSS Εφαρμογή CSS κανόνων Επικάλυψη CSS
Διαβάστε περισσότεραΣχεδιασμός και Ανάπτυξη Ιστότοπων
Βελώνης Γεώργιος Καθηγητής Σχεδιασμός και Ανάπτυξη Ιστότοπων Εισαγωγή στα CSS (Cascading Style Sheets) Παρουσίαση 13 η 1 Βελώνης Γεώργιος Καθηγητής Περιεχόμενα Εισαγωγή Πλεονεκτήματα χρήσης των CSS Βασικοί
Διαβάστε περισσότεραΗ Βίβλος των CSS. Εισαγωγή στα CSS
Η Βίβλος των CSS Εισαγωγή στα CSS Τα Διαδοχικά Φύλλα Στυλ (CSS, Cascading Style Sheets) αποτελούν ένα πολύ καλό εργαλείο για να μπορούμε να αλλάζουμε την εμφάνιση και τη διάταξη (layout) των ιστοσελίδων
Διαβάστε περισσότεραΣτοιχεία ορισμού θέσης (Positioning Elements)
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #7 0 : Ορισμός θέσης σε διατάξεις (positioned layouts). Γαβαλάς Δαμιανός dgavalas@aegean.gr Στοιχεία ορισμού θέσης (Positioning Elements) Οι ιδιότητες τοποθέτησης των CSS
Διαβάστε περισσότεραΕτικέτες HTML. <!-->: Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον
Ετικέτες HTML : Τα σχόλια χρησιμοποιούνται για να γράφουμε σημειώσεις μέσα στον πηγαίο κώδικα για να διευκολύνουμε την επεξεργασία και την συντήρηση του αρχείου. Τα σχόλια δεν εμφανίζονται στην οθόνη
Διαβάστε περισσότεραΝέες Τεχνολογίες στην Εκπαίδευση
Σχολή Εφαρμοσμένων Μαθηματικών και Φυσικών Επιστημών Εθνικό Μετσόβιο Πολυτεχνείο Νέες Τεχνολογίες στην Εκπαίδευση Επάλληλα φύλλα στυλ (CSS): Μια εισαγωγή Στεφανέας Πέτρος Ζαμαρίας Βασίλης Άδεια Χρήσης
Διαβάστε περισσότεραΕισαγωγή σε HTML και CSS. Παναγιώτης Τσαρχόπουλος
Εισαγωγή σε HTML και CSS Παναγιώτης Τσαρχόπουλος Περιεχόμενα Εισαγωγικές έννοιες Ορολογία και σύνταξη Κείμενο σε HTML έγγραφα Σύνδεσμοι Ψηφιακές - Ευφυείς Πόλεις - Εισαγωγή σε HTML και CSS 2 Εισαγωγικές
Διαβάστε περισσότεραΕμφάνιση και κρύψιμο στοιχείων
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #8 0 : Δυναμικά εφέ με χρήση CSS Γαβαλάς Δαμιανός dgavalas@aegean.gr Εμφάνιση και κρύψιμο στοιχείων Χρήση της ιδιότητας display με επιτρεπτές τιμές: none: κρύψιμο του στοιχείου
Διαβάστε περισσότερα3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ
2014 3. ΕΙΣΑΓΩΓΗ ΣΤΟ CSS ΓΙΩΡΓΟΣ ΓΙΑΝΝΑΚΑΚΗΣ, ΜΑΝΩΛΗΣ ΤΣΙΚΝΑΚΗΣ Εισαγωγή Το CSS (Cascading Style Sheets) είναι αρχεία με κατάληξη.css τα οποία καθορίζουν την μορφοποίηση των ιστοσελίδων. Μέσω αυτών επιτυγχάνεται
Διαβάστε περισσότεραΠρογραμματισμός Διαδικτύου Ασκήσεις Εργαστηρίου
Προγραμματισμός Διαδικτύου Ασκήσεις Εργαστηρίου Ενότητα: ΕΡΓΑΣΤΗΡΙΑΚΗ ΑΣΚΗΣΗ Νο 03 Δρ. Μηνάς Δασυγένης mdasyg@ieee.org Τμήμα Μηχανικών Πληροφορικής και Τηλεπικοινωνιών Εργαστήριο Ψηφιακών Συστημάτων και
Διαβάστε περισσότερα1. <body> 2. <header> 3. <h1> My Page </h1> 4. </header> 5. <section>
Ενδεικτικές ερωτήσεις 1. Τι σημαίνουν τα αρχικά CSS 2. Τι σημαίνουν τα αρχικά HTML 3. Ποια η διαφορά μεταξύ Internet και Web; a. Είναι το ίδιο b. Το Web είναι μια υπηρεσία του διαδικτύου 4. Ποια η διαφορά
Διαβάστε περισσότεραΕργαστήριο #9 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. βεβαιωθείτε ότι έχετε ολοκληρώσει τις προηγούμενες ασκήσεις Οδηγίες
Εργαστήριο #9 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε
Διαβάστε περισσότεραΣτις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver.
Στις επόµενες διαφάνειες θα δούµε τις ιδιότητες του CSS που µπορούµε να επηρεάσουµε µέσω του Dreamweaver. 37 Αφού καθορίσετε τα βασικά στοιχεία του νέου κανόνα css, όπως είδαµε στις προηγούµενες διαφάνειες,
Διαβάστε περισσότεραΒασικά στοιχεία του CSS
Βασικά στοιχεία του CSS Περιεχόμενα Τι είναι CSS Πλεονεκτήματα CSS μορφοποίησης Συντακτικό του CSS Ιδιότητες CSS Εφαρμογή CSS κανόνων Επικάλυψη CSS κανόνων 2 Μορφοποίηση με HTML Η HTML είναι σχεδιασμένη
Διαβάστε περισσότεραΣχεδιασμός και Ανάπτυξη Ιστότοπων
Σχεδιασμός και Ανάπτυξη Ιστότοπων CSS: Φόντο (background) και Περίγραμμα (border) στοιχείου ιστοσελίδας Παρουσίαση 16 η 1 Βελώνης Γεώργιος Καθηγητής Browsers δοκιμών Οι δοκιμές έγιναν στους παρακάτω browsers
Διαβάστε περισσότεραCSS Εργαστήριο 5. Θέση και διάταξη
Display - Επίδειξη CSS Εργαστήριο 5. Θέση και διάταξη Η ιδιότητα display καθορίζει πως και εάν ένα στοιχείο εμφανίζεται στην οθόνη. Τα περισσότερα στοιχεία, εξορισμού είναι είτε block είτε inline. Ένα
Διαβάστε περισσότεραΤο απεικονιστικό μοντέλο μορφοποίησης των CSS
Δικτυακά Πολυμέσα ΙΙ Εργαστήριο #6 0 : CSS: Χρήση των ιδιοτήτων του κουτιού (box properties). Διάταξη σελίδων Γαβαλάς Δαμιανός dgavalas@aegean.gr Το απεικονιστικό μοντέλο μορφοποίησης των CSS Περιγράφει
Διαβάστε περισσότεραCascading Style Sheets
Cascading Style Sheets CSS είναι το ακρωνύµιο του Cascading Style Sheets (Επικαλυπτόµενα φύλλα στυλ). CSS είναι µια γλώσσα style δηλ. µια γλώσσα η οποία καθορίζει τη εµφάνιση HTML εγγράφων. Για παράδειγµα,
Διαβάστε περισσότεραCSS 1. Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών
CSS 1 Διδάσκοντες: Π. Αγγελάτος, Δ. Ζήνδρος Επιμέλεια διαφανειών: Δ. Ζήνδρος Σχολή Ηλεκτρολόγων Μηχανικών και Μηχανικών Υπολογιστών Άδεια Χρήσης Το παρόν εκπαιδευτικό υλικό υπόκειται σε άδειες χρήσης Creative
Διαβάστε περισσότεραΕισαγωγή στην HTML. Κεφ. HTML + CSS
Εισαγωγή στην HTML Κεφ. HTML + CSS Συστατικά καλής Ιστοσελίδας α) HTML για το Περιεχόμενο β) CSS για τη μορφοποίηση γ) Javascript για διαδραστικότητα Παράδειγμα Ολυμπιακός Πανιώνιος ΠΑΟΚ Παναθηναϊκός Ξάνθη
Διαβάστε περισσότεραΆσκηση 6 Επαναληπτική Άσκηση HTML
Άσκηση 6 Επαναληπτική Άσκηση HTML ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει τον τύπο του αρχείου Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο
Διαβάστε περισσότεραΣΗΜΑΣΙΟΛΟΓΙΚΟΣ ΙΣΤΟΣ - XML
ΠΑΝΕΠΙΣΤΗΜΙΟ ΠΕΙΡΑΙΩΣ ΤΜΗΜΑ ΨΗΦΙΑΚΩΝ ΣΥΣΤΗΜΑΤΩΝ ΣΗΜΑΣΙΟΛΟΓΙΚΟΣ ΙΣΤΟΣ - XML Εργαστήριο 4 Στουγιάννου Ελευθερία estoug@unipi.gr Περιεχόμενα Τέταρτου Εργαστηριακού Μαθήματος XML CSS (CASCADING STYLE SHEETS)
Διαβάστε περισσότεραΟδηγίες Στο σημερινό εργαστήριο θα αρχίσετε να χρησιμοποιείτε βασικές οδηγίες μορφοποίησης της ιστοσελίδας σας (κάτι που έχουμε αποφύγει έως τώρα!).
Εργαστήριο #8 Τι πρέπει να έχετε ολοκληρώσει από το προηγούμενο εργαστήριο. Το σημερινό εργαστήριο είναι ανεξάρτητο από τα προηγούμενα, επειδή όμως θα ζητηθεί να ανακυκλώσετε υλικό από εκείνα, βεβαιωθείτε
Διαβάστε περισσότεραΑ ΛΥΚΕΙΟΥ - ΕΦΑΡΜΟΓΕΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΜΑΪΟΣ 2019 ΕΝΔΕΙΚΤΙΚΕΣ ΕΡΩΤΗΣΕΙΣ ΚΑΤΑΝΟΗΣΗΣ
Το υλικό αυτό δίνεται στους μαθητές για τη σωστή μελέτη της διδαχθείσας ύλης του μέρους Β. Πρόκειται για ένα συμπαγή κορμό ερωτήσεων και ασκήσεων οι οποίες καλύφθηκαν κατά τη διάρκεια της έως τώρα σχολικής
Διαβάστε περισσότεραΣχεδίαση και Ανάπτυξη Ιστότοπων. HTML Στοιχεία - Βασικές Ετικέτες Ειδικοί Χαρακτήρες Παρουσίαση 5 η. Βελώνης Γεώργιος Καθηγητής Πληροφορικής ΠΕ20
Σχεδίαση και Ανάπτυξη Ιστότοπων HTML Στοιχεία - Βασικές Ετικέτες Ειδικοί Χαρακτήρες Παρουσίαση 5 η 1 Βελώνης Γεώργιος Καθηγητής Σημασία συμβόλων HTML5 tags Obsolete tags: Μην αφήνετε αυτές τις ετικέτες
Διαβάστε περισσότεραΠληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 6 ο Τεχνολογίες Διαδικτύου: HTML II Εισαγωγή Εικόνων Οι φυλλομετρητές μπορούν να εμφανίσουν ένθετες
Διαβάστε περισσότεραΗ γλώσσα HTML. Επιμέλεια: Δέγγλερη Σοφία
Η γλώσσα HTML Επιμέλεια: Δέγγλερη Σοφία Υπερκείμενο Το δομικό χαρακτηριστικό του Παγκόσμιου Ιστού Ένα αρχείο Απλό κείμενο και υπερσύνδεσμοι Υπερσύνδεσμος Μετάβαση σε διάφορα άλλα έγγραφα Αποτελείται από
Διαβάστε περισσότεραTEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
Διαβάστε περισσότεραΣτην ενότητα αυτή θα δούμε πως με CSS ιδιότητες μπορούμε να ορίσουμε μέγεθος, γραμματοσειρά και άλλα χαρακτηριστικά του κειμένου στην ιστοσελίδα μας
Γραμματοσειρά Στην ενότητα αυτή θα δούμε πως με CSS ιδιότητες μπορούμε να ορίσουμε μέγεθος, γραμματοσειρά και άλλα χαρακτηριστικά του κειμένου στην ιστοσελίδα μας Γραμματοσειρά κειμένου Με την CSS ιδιότητα
Διαβάστε περισσότεραΣημασιολογικός Ιστός (Semantic Web) - XML
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Σημασιολογικός Ιστός (Semantic Web) - XML 8/11/2016 Δρ. Ανδριάνα Πρέντζα Αναπληρώτρια Καθηγήτρια aprentza@unipi.gr Πανεπιστήμιο Πειραιά Τμήμα Ψηφιακών Συστημάτων
Διαβάστε περισσότεραΕισαγωγή στο CSS Από: Λία Βέρου
Εισαγωγή στο CSS Από: Λία Βέρου Τι είναι το CSS (Cascading Style Sheets); To 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
Διαβάστε περισσότεραΓαβαλάς Δαμιανός dgavalas@aegean.gr
Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας Δικτυακά Πολυμέσα IΙ (Β Έτος, 4ο εξ) Εργαστήριο #3ο: Ορισμός επιλογέων, μορφοποίηση με CSS Γαβαλάς Δαμιανός
Διαβάστε περισσότεραΕισαγωγή στο CSS Από: Μιχαήλια Κομβούτη Βέρου
Εισαγωγή στο CSS Από: Μιχαήλια Κομβούτη Βέρου Τι είναι το CSS (Cascading Style Sheets); To CSS είναι μια απλή γλώσσα που μας βοηθάει να ορίσουμε με σαφήνεια και ιδιαίτερη ευελιξία τον τρόπο με τον οποίο
Διαβάστε περισσότεραΠρογραμματισμός Παγκόσμιου Ιστού
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Προγραμματισμός Παγκόσμιου Ιστού 2 η Διάλεξη Δημοσθένης Κυριαζής Δευτέρα 6 Μαρτίου 2017 Σημερινή διάλεξη Σύνοψη προηγούμενης διάλεξης HTML / HTML5 Λίστες,
Διαβάστε περισσότεραΕισαγωγή στην Επιστήμη Υπολογιστών. Εισαγωγή στην HTML. Άννα Κεφάλα Παναγιώτα Μιχόλια
Εισαγωγή στην Επιστήμη Υπολογιστών Εισαγωγή στην HTML Άννα Κεφάλα Παναγιώτα Μιχόλια Εργαστηριακές Σημειώσεις ΕΙΣΑΓΩΓΗ ΣΤΗ ΓΛΩΣΣΑ HTML ΜΕΡΟΣ Β': CSS ΚΑΙ FORMS 2 Cascading Style Sheets (CSS) Cascading Style
Διαβάστε περισσότεραΣχεδόν όλες οι ιστοσελίδες βασίζονται σε μεγάλο βαθμό σε πίνακες. Για να εισάγουμε έναν πίνακα επιλέγουμε από το μενού Insert->Table.
DreamWeaver - Άσκηση 4η Πίνακες Παρακάτω θα δούμε πως μπορούμε να δημιουργούμε και να επεξεργαζόμαστε πίνακες, μια πολύ βασική δομή. Θα δούμε πως γίνεται εισαγωγή πίνακα, ένωση κελιών του πίνακα, προσθήκη
Διαβάστε περισσότεραΓραπτή εξέταση. Γαβαλάς Δαμιανός dgavalas@aegean.gr. Δικτυακά Πολυμέσα ΙΙ Διάλεξη #12 η : Επανάληψη, προετοιμασία για τις γραπτές εξετάσεις
Δικτυακά Πολυμέσα ΙΙ Διάλεξη #12 η : Επανάληψη, προετοιμασία για τις γραπτές εξετάσεις Γαβαλάς Δαμιανός dgavalas@aegean.gr Γραπτή εξέταση H διάρκεια της εξέτασης θα είναι 2 ώρες και 15 Θα απαντήσετε σε
Διαβάστε περισσότερα«Εθαξκνγέο Δηαδηθηύνπ»
«Εθαξκνγέο Δηαδηθηύνπ» CSS Μνξθνπνίεζε θαη Δηάηαμε κε ζηπι http://www.elizabethcastro.com/html5ed/examples/#c10 http://www.elizabethcastro.com/html5ed/examples/#c11 Πίλαθεο http://www.elizabethcastro.com/html5ed/examples/#c14
Διαβάστε περισσότεραΠρογραμματισμός Παγκόσμιου Ιστού
Πανεπιστήμιο Πειραιώς Τμήμα Ψηφιακών Συστημάτων Προγραμματισμός Παγκόσμιου Ιστού 11 η Διάλεξη Δημοσθένης Κυριαζής Τρίτη 23 Μαΐου 2017 Σημερινή διάλεξη Client-server programming HTML5 CSS Layouts Javascript
Διαβάστε περισσότεραΗTML και XHTML Βασικές. Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας
ΗTML και XHTML Βασικές έννοιες Βασική σύνταξη HTML και HTML Ηδομή μιας HTML σελίδας Η γραμματική της ΗΤML Όπως κάθε γλώσσα έχει μια γραμματική
Διαβάστε περισσότεραΒάσεις Δεδομένων. Dept. Of Mathematics University of Ioannina
Βάσεις Δεδομένων Κωδικός Μαθήματος: MK741 Είδος Μαθήματος: Επιλογής-Εργαστηριακό Εξάμηνο: 7o Διδάσκων: Κοντογιάννης Σωτήριος Email: skontog@gmail.com, skontog@cc.uoi.gr Dept. Of Mathematics University
Διαβάστε περισσότεραCoding Bootcamp. Εισαγωγή στo CSS
Εισαγωγή στo CSS CSS (Cascading Style Sheets) Η Html σχεδιάστηκε αρχικά για να προβάλλει κείμενο και είχε σκοπό να «ορίσει» το περιεχόμενο μιας σελίδας υπό την έννοια ποιο κείμενο είναι επικεφαλίδα, ποιο
Διαβάστε περισσότεραΣε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας
Σε αυτό το µάθηµα θα ασχοληθούµε µε τη βελτίωση της εµφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισµό όλων των αλλαγών στην εµφάνιση της σελίδας µέσω της τεχνολογίας των ιαδοχικών Φύλλων Στυλ (cascading
Διαβάστε περισσότεραΠοιες είναι οι κύριες ετικέτες που χρησιμοποιεί η HTML για την περιγραφή της συνολικής δομής μιας ιστοσελίδας;
Τι είναι η HTML; Η HTML είναι το ακρωνύμιο των λέξεων HyperText Markup Language, δηλαδή Γλώσσα Χαρακτηρισμού Υπερ Κειμένου και βασίζεται στη γλώσσα SGML, Standard Generalized Markup Language, που είναι
Διαβάστε περισσότεραΕΡΓΑΣΤΗΡΙΑΚΗ ΑΣΚΗΣΗ 2 ΜΕΛΕΤΗ ΚΑΙ ΕΦΑΡΜΟΓΗ ΔΗΜΙΟΥΡΓΙΑΣ HTML ΣΕΛΙΔΩΝ ΣΥΝΔΕΣΜΟΙ
ΕΡΓΑΣΤΗΡΙΑΚΗ ΑΣΚΗΣΗ 2 ΜΕΛΕΤΗ ΚΑΙ ΕΦΑΡΜΟΓΗ ΔΗΜΙΟΥΡΓΙΑΣ HTML ΣΕΛΙΔΩΝ ΣΥΝΔΕΣΜΟΙ Στην άσκηση αυτή θα εμπλουτίσουμε την ιστοσελίδα που φτιάξαμε στην προηγούμενη άκηση με πίνακες, συνδέσμους και γραφικά. 1.
Διαβάστε περισσότεραΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΣΧΟΛΙΚΟ ΒΙΒΛΙΟ ΚΕΦΑΛΑΙΟ 11 Ευάγγελος Χ. Ζιούλας (Καθηγητής Πληροφορικής)
http://www.zioulas.gr ΕΙΣΑΓΩΓΗ ΣΤΗΝ HTML ΣΧΟΛΙΚΟ ΒΙΒΛΙΟ ΚΕΦΑΛΑΙΟ 11 Ευάγγελος Χ. Ζιούλας (Καθηγητής Πληροφορικής) WEB SERVER Είναι μια εφαρμογή software που αναλαμβάνει την αποστολή μιας ιστοσελίδας σε
Διαβάστε περισσότεραΚειµενογράφοι ετικετών
ΕΠΛ 012 Γλώσσα Μορφοποίησης HTML Πως κτίζουµε τις Ετικέτες Notepad ή άλλο TEXT editor Πού τα κάνουµε Save? Πώς τα οργανώνουµε Πώς τα βάζουµε δηµόσια online Τα αρχεία να τελειώνουν σε.html ή.htm Πως ξεκινούµε
Διαβάστε περισσότεραΕΠΛ 012. ιαδοχικά Φύλλα Στυλ
ΕΠΛ 012 ιαδοχικά Φύλλα Στυλ Cascading Style Sheets (CSS) Φύλλα Στυλ Μηχανισµός καθορισµού και τροποποίησης µορφοποίησης εγγράφων από τους συγγράφεις Πιο γενικός τρόπος από το καθορισµό όλων των χαρακτηριστικών
Διαβάστε περισσότεραCSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML
CSS Εργαστήριο 1. Εισαγωγή - Σύνταξη - Εφαρμογή στην HTML Εισαγωγή Το CSS (Cascading Style Sheets ή Επικαλυπτόμενα Φύλλα Στυλ) μας επιτρέπει να αλλάξουμε τον τρόπο με τον οποίο παρουσιάζονται τα στοιχεία
Διαβάστε περισσότεραΠίνακες. ιδιότητες ετικέτας <tr>
Πίνακες ιδιότητες ετικέτας Ιδιότητα align στοιχίζει κατά την οριζόντια διεύθυνση τα περιεχόμενα μιας γραμμής του πίνακα αριστερά (left), δεξιά (right), στο κέντρο (center), ή με πλήρη στοίχιση (justify)
Διαβάστε περισσότερα12. HTML και CSS. Προαπαιτούμενες Γνώσεις: Απλή γνώση της σύνταξης HTML. Αρκεί η άσκηση «Η γλώσσα HTML Εισαγωγή».
12. HTML και CSS Σκοπός του Εργαστηρίου: Σκοπός της παρούσας εργαστηριακής άσκησης είναι η εισαγωγή στην τεχνολογία Cascading Style Sheets (CSS), η εξοικείωση με τις βασικές αρχές και χρήσεις της και τη
Διαβάστε περισσότεραΒαρβάκειο Πρότυπο Γυμνάσιο
Παραδόσεις & εργαστηριακές ασκήσεις στην HTML Βαρβάκειο Πρότυπο Γυμνάσιο Σχολ. Χρονιά 2016-2017 Θ. Οτζάκογλου Εργαστήρι Πληροφορικής Σχολ. Έτος 2016 2017 Αν και δεν είναι μία ακόμη «γλώσσα προγραμματισμού»,
Διαβάστε περισσότεραΤεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML)
Τεχνολογίες Διαδικτύου (Εξασκηθείτε στην HTML) 1. Δημιουργία μιας απλής σελίδας HTML Ανοίξτε το Notepad ακολουθώντας τη διαδρομή Start All Programs Accessories Notepad Πληκτρολογήστε το ακόλουθο κείμενο:
Διαβάστε περισσότεραΜΑΘΗΜΑ Στοίχιση Παραγράφων. 2. Εσοχές Παραγράφων ΣΤΟΧΟΙ:
ΜΑΘΗΜΑ 4 ΣΤΟΧΟΙ: 1. Στοίχιση Παραγράφων 2. Εσοχές Παραγράφων 3. Διάστημα Μεταξύ Γραμμών (Διάστιχο) 4. Απόσταση Μεταξύ Παραγράφων 5. Καθορισμός Στηλοθετών (Tabs) 6. Μετακίνηση Στηλοθετών 7. Διαγραφή Στηλοθετών
Διαβάστε περισσότεραΣχεδίαση και Ανάπτυξη Ιστότοπων
Σχεδίαση και Ανάπτυξη Ιστότοπων HTML Καθορισμός Χρωμάτων και Γραμματοσειρών σε μια ιστοσελίδα Παρουσίαση 7 η Βελώνης Γεώργιος Καθηγητής 1 Σημασία συμβόλων HTML5 tags. Obsolete tags: Μην αφήνετε αυτές τις
Διαβάστε περισσότεραCTEC-153: ΥΠΟΛΟΓΙΣΤΙΚΑ ΦΥΛΛΑ
ΜΑΘΗΜΑ 5 ΣΤΟΧΟΙ: 1. Μορφοποίηση Αριθμών 2. Αλλαγή Μεγέθους Και Τύπου Γραμματοσειράς 3. Χρησιμοποίηση Πλάγιων, Έντονων, Υπογραμμισμένων Χαρακτήρων 4. Αλλαγή Χρώματος Γραμματοσειράς 5. Παράθυρο Διαλόγου
Διαβάστε περισσότεραΕΠΛ 003: ΕΠΙΣΤΗΜΗ ΤΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΚΑΙ ΠΛΗΡΟΦΟΡΙΑΚΑ ΣΥΣΤΗΜΑΤΑ HTML
ΕΠΛ 003: ΕΠΙΣΤΗΜΗ ΤΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΚΑΙ ΠΛΗΡΟΦΟΡΙΑΚΑ ΣΥΣΤΗΜΑΤΑ HTML Στόχοι 1 Να δημιουργήσουμε υπερκείμενα με την Γλώσσα Επισημείωσης Υπερκειμένων (hypertext markup language, HTML). Υπολογιστικά συστήματα:
Διαβάστε περισσότεραΠληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου. Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I
Πληροφορική Τμήμα Σχεδιασμού & Τεχνολογίας Ξύλου & Επίπλου Αντώνιος Καραγεώργος Ευανθία Τσιλιχρήστου Μάθημα 5 ο Τεχνολογίες Διαδικτύου: HTML I Διαδικτυακή Εφαρμογή (1/2) Ως διαδικτυακή εφαρμογή μπορούμε
Διαβάστε περισσότεραHTML... 1. Εισαγωγή στην HTML και τα CSS
HTML...... 1 Εισαγωγή στην HTML και τα CSS HTML...... 2 HTML. H HTML (HYPERTEXT MARKUP LANGUAGE), είναι µία γλώσσα η οποία «λέει» στον υπολογιστή πως θα πρέπει να εµφανίσει µία ιστοσελίδα. Τα αρχεία στα
Διαβάστε περισσότεραTEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)
TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο) Διδάσκων: Ανδρέας Γιαννακουλόπουλος Επιστημονικός συνεργάτης Εργαστηρίου: Στέλλα Λάμπουρα Εαρινό εξάμηνο Χρηματοδότηση Το παρόν εκπαιδευτικό υλικό έχει αναπτυχθεί
Διαβάστε περισσότεραΕΠΛ 012. Φύλλα Στυλ (ΙΙ)
ΕΠΛ 012 Φύλλα Στυλ (ΙΙ) Τροποποίηση χρωµάτων Color: "όνοµα χρώµατος" rgb (rr,gg,bb) #RRGGBB RGB συνιστώσες όπου rr,gg,bb είναι ακέραιοι από το 0 255 H1 {color: rgb(255,0,0)} κόκκινες επικεφαλίδες background-colorcolor
Διαβάστε περισσότεραΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ
ΠΡΟΓΡΑΜΜΑΤΙΣΤΙΚΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΟ ΔΙΑΔΙΚΤΥΟ Κεφάλαιο 4. Η γλώσσα HTML Επιμέλεια: Καραγιάννης Σπύρος Καθηγητής ΠΕ19 Βασικοί κανόνες σύνταξης HTML ομή σελίδας HTML Μορφοποίηση κειμένου Κατάλογοι Εισαγωγή
Διαβάστε περισσότεραΕισαγωγή στον Παγκόσμιο ιστό και στη γλώσσα Html. Χρ. Ηλιούδης
Εισαγωγή στον Παγκόσμιο ιστό και στη γλώσσα Html Χρ. Ηλιούδης Παγκόσμιος Ιστός (WWW) Ο Παγκόσμιος Ιστός (World Wide Web WWW), ή απλώς Ιστός, βασίζεται στην ιδέα των κατανεμημένων πληροφοριών. Αντί όλες
Διαβάστε περισσότεραΔιάλεξη 4η CSS intermediate
Διάλεξη 4η CSS intermediate Στέλιος Μόσχογλου Θεοδόσης Σουργκούνης Αντώνης Χρυσόπουλος I S S E L D e. c o. d e (Intelligent Systems & Software Engineering Lab) Στόχος της ώρας Κλάσεις & Ids Εμφώλευση &
Διαβάστε περισσότεραΒαρβάκειο Πρότυπο Γυμνάσιο
Παραδόσεις & εργαστηριακές ασκήσεις στην HTML Βαρβάκειο Πρότυπο Γυμνάσιο Σχολ. Χρονιά 2017-2018 Θ. Οτζάκογλου Εργαστήρι Πληροφορικής Σχολ. Έτος 2016 2017 Αν και δεν είναι μία ακόμη «γλώσσα προγραμματισμού»,
Διαβάστε περισσότεραΣχεδιασμός και Ανάπτυξη Ιστοσελίδων ΙΙ ΙΕΚ ΤΡΙΑΝΔΡΙΑΣ ΓΡΑΦΙΣΤΑΣ ΕΝΤΥΠΟΥ ΚΑΙ ΗΛΕΚΤΡΟΝΙΚΩΝ ΜΕΣΩΝ. CSS - Cascading Style Sheets
Σχεδιασμός και Ανάπτυξη Ιστοσελίδων ΙΙ ΙΕΚ ΤΡΙΑΝΔΡΙΑΣ ΓΡΑΦΙΣΤΑΣ ΕΝΤΥΠΟΥ ΚΑΙ ΗΛΕΚΤΡΟΝΙΚΩΝ ΜΕΣΩΝ CSS - Cascading Style Sheets Τι είναι τα CSS; Τα CSS (Διαδοχικά Φύλλα Στυλ) αποτελούν ένα πολύ καλό εργαλείο
Διαβάστε περισσότεραΣχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας
Πανεπιστήμιο Αιγαίου Σχολή Κοινωνικών Επιστημών Τμήμα Πολιτισμικής Τεχνολογίας Και Επικοινωνίας ικτυακά Πολυμέσα Ι (Β Έτος, 3ο εξ) ιάλεξη #6η: HTML: ετικέτες ΜΕΤΑ, Cascading Style Sheet (CSS) Γαβαλάς Δαμιανός
Διαβάστε περισσότεραΣχεδίαση ιστοσελίδων
Τ.Ε.Ι. Δυτικής Ελλάδας Σχολή Διοίκησης και Οικονομίας Τμήμα Διοίκησης Επιχειρήσεων - Πάτρα Σχεδίαση ιστοσελίδων Θεώνη Πιτουρά, Γιάννης Κουτσονίκος Σημειώσεις για το Εργαστήριο «Επιχειρηματικές δικτυακές
Διαβάστε περισσότεραΗ Βίβλος των CSS - Μέρος 4 Positioning, Layers και Web Standards
Η Βίβλος των CSS - Μέρος 4 Positioning, Layers και Web Standards Τα Επιπλέοντα Στοιχεία Ένα στοιχείο μπορεί να τοποθετηθεί στα δεξιά (right) ή στα αριστερά (left) με χρήση της ιδιότητας float. Αυτό πρακτικά
Διαβάστε περισσότεραΕπαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML
Επαναληπτική Άσκηση ΕΤΙΚΕΤΕΣ HTML ΕΤΙΚΕΤΑ ΠΕΡΙΓΡΑΦΗ ΙΔΙΟΤΗΤΕΣ ΙΔΙΟΤΗΤΑ ΤΙΜΗ ΠΕΡΙΓΡΑΦΗ Βασικές Ορίζει ένα αρχείο HTML Ορίζει ένα τίτλο για το αρχείο Ορίζει το σώµα της background URL
Διαβάστε περισσότεραΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ
ΒΑΣΙΚΕΣ ΑΡΧΕΣ ΣΧΕΔΙΑΣΜΟΥ ΕΦΑΡΜΟΓΩΝ Βαγγελιώ Καβακλή Τμήμα Πολιτισμικής Τεχνολογίας & Επικοινωνίας 8 Μαρτίου 2001 Hypertext Markup Language (HTML)! Σε μια ιστοσελίδα μπορούν να εμφανίζονται διαφορετικά
Διαβάστε περισσότεραΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ. Κειμενογράφος WORD
ΕΠΕΞΕΡΓΑΣΙΑ ΚΕΙΜΕΝΟΥ Κειμενογράφος WORD ΣΚΟΠΟΣ Η ανάπτυξη δεξιοτήτων επεξεργασίας κειμένου ΠΡΟΤΑΣΕΙΣ ΚΑΙ ΡΥΘΜΙΣΕΙΣ Άνω περιθώριο (top margin) : 2.49cm Κάτω περιθώριο (bottom margin) :5.99cm Αριστερό περιθώριο
Διαβάστε περισσότεραΤεχνολογίες Διαδικτύου - Εργαστήριο 1 ο
Τεχνολογίες Διαδικτύου - Εργαστήριο 1 ο 1. Δημιουργία μιας απλής σελίδας HTML Στον προσωπικό σας κατάλογο δημιουργήστε ένα φάκελο με όνομα HTML. Ανοίξτε το Notepad ακολουθώντας τη διαδρομή (Start All Programs
Διαβάστε περισσότεραΣε αυτό το μάθημα θα ασχοληθούμε με τη βελτίωση της εμφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισμό όλων των αλλαγών τις οποίες επιθυμούμε να
Σε αυτό το μάθημα θα ασχοληθούμε με τη βελτίωση της εμφάνισης ενός ιστοτόπου, αλλά και τον εύκολο χειρισμό όλων των αλλαγών τις οποίες επιθυμούμε να κάνουμε μέσω ενός εξωτερικού αρχείου.το αρχείο αυτό
Διαβάστε περισσότερα