"Εθαξκνγέο Δηαδηθηύνπ"

Σχετικά έγγραφα

"Εθαρμογές Διαδικηύοσ"

Writing for A class. Describe yourself Topic 1: Write your name, your nationality, your hobby, your pet. Write where you live.

LESSON 6 (ΜΑΘΗΜΑ ΕΞΙ) REF : 201/045/26-ADV. 10 December 2013

BECAUSE WE REALLY WANT TO KNOW WHAT YOU THINK ABOUT SCHOOL AND YOUR GARDEN. Fairly true If I decide to learn something hard, I can.

Στεγαστική δήλωση: Σχετικά με τις στεγαστικές υπηρεσίες που λαμβάνετε (Residential statement: About the residential services you get)

"Εθαξκνγέο Δηαδηθηύνπ"

FINAL TEST B TERM-JUNIOR B STARTING STEPS IN GRAMMAR UNITS 8-17

LESSON 28 (ΜΑΘΗΜΑ ΕΙΚΟΣΙ ΟΚΤΩ) REF : 201/033/28. 2 December 2014

Πώς μπορεί κανείς να έχει έναν διερμηνέα κατά την επίσκεψή του στον Οικογενειακό του Γιατρό στο Ίσλινγκτον Getting an interpreter when you visit your

The Simply Typed Lambda Calculus

Οι αδελφοί Montgolfier: Ψηφιακή αφήγηση The Montgolfier Βrothers Digital Story (προτείνεται να διδαχθεί στο Unit 4, Lesson 3, Αγγλικά Στ Δημοτικού)

Final Test Grammar. Term C'

ΕΠΛ 003: ΕΠΙΣΤΗΜΗ ΤΗΣ ΠΛΗΡΟΦΟΡΙΚΗΣ ΚΑΙ ΠΛΗΡΟΦΟΡΙΑΚΑ ΣΥΣΤΗΜΑΤΑ HTML

LESSON 12 (ΜΑΘΗΜΑ ΔΩΔΕΚΑ) REF : 202/055/32-ADV. 4 February 2014

3.4 SUM AND DIFFERENCE FORMULAS. NOTE: cos(α+β) cos α + cos β cos(α-β) cos α -cos β

LESSON 14 (ΜΑΘΗΜΑ ΔΕΚΑΤΕΣΣΕΡΑ) REF : 202/057/34-ADV. 18 February 2014

7 Present PERFECT Simple. 8 Present PERFECT Continuous. 9 Past PERFECT Simple. 10 Past PERFECT Continuous. 11 Future PERFECT Simple

ΑΓΓΛΙΚΑ ΙΙΙ. Ενότητα 12b: The Little Prince. Ζωή Κανταρίδου Τμήμα Εφαρμοσμένης Πληροφορικής

Κατανοώντας και στηρίζοντας τα παιδιά που πενθούν στο σχολικό πλαίσιο

Εργαστήριο Ανάπτυξης Εφαρμογών Βάσεων Δεδομένων. Εξάμηνο 7 ο

Σχεδίαση και Ανάπτυξη Ιστότοπων

derivation of the Laplacian from rectangular to spherical coordinates

ΟΡΟΛΟΓΙΑ - ΞΕΝΗ ΓΛΩΣΣΑ

TEC410 Ανάπτυξη Δικτυακών Τόπων (Δ εξάμηνο)

Section 9.2 Polar Equations and Graphs

Οδηγίες Αγοράς Ηλεκτρονικού Βιβλίου Instructions for Buying an ebook

Right Rear Door. Let's now finish the door hinge saga with the right rear door

STARTING STEPS IN GRAMMAR, FINAL TEST C TERM 2012 UNITS 1-18

MR. DICKSON'S METHOD FOR BAND Book Two

1999 MODERN GREEK 2 UNIT Z

ΟΙ ΑΞΙΕΣ ΤΗΣ ΖΩΗΣ THE VALUES OF LIFE Η ΥΠΕΥΘΥΝΟΤΗΤΑ..THE RESPONSIBILITY ΔΗΜΗΤΡΑ ΚΩΝΣΤΑΝΤΙΝΟΥ

EU-Profiler: User Profiles in the 2009 European Elections

Άζκηζη 1 -Δημιοςπγία ιζηοζελίδων με HTML μέπορ 1 ο

36 ο Δημοτικό Σχολείο Αθηνών ΣΧΕΔΙΟ ΔΡΑΣΗΣ. ΤΙΤΛΟΣ: ΠΑΙΔΙ και ΕΥΡΩΠΑΙΚΗ ΕΝΩΣΗ-Μάθε τα Δικαιώματά σου

How to register an account with the Hellenic Community of Sheffield.

Newborn Upfront Payment & Newborn Supplement

Calculating the propagation delay of coaxial cable

Βάσεις Δεδομέμωμ. Εξγαζηήξην V. Τκήκα Πιεξνθνξηθήο ΑΠΘ

ΑΡΙΣΤΟΤΕΛΕΙΟ ΠΑΝΕΠΙΣΤΗΜΙΟ ΘΕΣΣΑΛΟΝΙΚΗΣ

Policy Coherence. JEL Classification : J12, J13, J21 Key words :

Εργαστήριο 9. Styling with Javascript

ΑΓΓΛΙΚΗ ΓΛΩΣΣΑ ΣΕ ΕΙΔΙΚΑ ΘΕΜΑΤΑ ΔΙΕΘΝΩΝ ΣΧΕΣΕΩΝ & ΟΙΚΟΝΟΜΙΑΣ

Verklarte Nacht, Op.4 (Εξαϋλωμένη Νύχτα, Έργο 4) Arnold Schoenberg ( )

Χρειάζεται να φέρω μαζί μου τα πρωτότυπα έγγραφα ή τα αντίγραφα; Asking if you need to provide the original documents or copies Ποια είναι τα κριτήρια

Phys460.nb Solution for the t-dependent Schrodinger s equation How did we find the solution? (not required)

Επιβλέπουσα καθηγήτρια: Ιμπριξή Ελένη. Μαυροπάνου Σοφία (Α.Μ ) Μπαλόπητας Βασίλειος (Α.Μ )

ΠΑΝΕΠΙΣΤΗΜΙΟ ΚΥΠΡΟΥ ΤΜΗΜΑ ΠΛΗΡΟΦΟΡΙΚΗΣ. ΕΠΛ342: Βάσεις Δεδομένων. Χειμερινό Εξάμηνο Φροντιστήριο 10 ΛΥΣΕΙΣ. Επερωτήσεις SQL

ANSWERSHEET (TOPIC = DIFFERENTIAL CALCULUS) COLLECTION #2. h 0 h h 0 h h 0 ( ) g k = g 0 + g 1 + g g 2009 =?

the total number of electrons passing through the lamp.

(C) 2010 Pearson Education, Inc. All rights reserved.

«ΨΥΧΙΚΗ ΥΓΕΙΑ ΚΑΙ ΣΕΞΟΥΑΛΙΚΗ» ΠΑΝΕΥΡΩΠΑΪΚΗ ΕΡΕΥΝΑ ΤΗΣ GAMIAN- EUROPE

EE512: Error Control Coding

Main source: "Discrete-time systems and computer control" by Α. ΣΚΟΔΡΑΣ ΨΗΦΙΑΚΟΣ ΕΛΕΓΧΟΣ ΔΙΑΛΕΞΗ 4 ΔΙΑΦΑΝΕΙΑ 1

John Mavrikakis ENGLISH MULTIBOOK

A ΜΕΡΟΣ. 1 program Puppy_Dog; 2 3 begin 4 end. 5 6 { Result of execution 7 8 (There is no output from this program ) 9 10 }

Η γλώσσα XHTML: διαφορές με HTML, μετατροπή

ΚΥΠΡΙΑΚΗ ΕΤΑΙΡΕΙΑ ΠΛΗΡΟΦΟΡΙΚΗΣ CYPRUS COMPUTER SOCIETY ΠΑΓΚΥΠΡΙΟΣ ΜΑΘΗΤΙΚΟΣ ΔΙΑΓΩΝΙΣΜΟΣ ΠΛΗΡΟΦΟΡΙΚΗΣ 11/3/2006

ΚΥΠΡΙΑΚΟΣ ΣΥΝΔΕΣΜΟΣ ΠΛΗΡΟΦΟΡΙΚΗΣ CYPRUS COMPUTER SOCIETY 21 ος ΠΑΓΚΥΠΡΙΟΣ ΜΑΘΗΤΙΚΟΣ ΔΙΑΓΩΝΙΣΜΟΣ ΠΛΗΡΟΦΟΡΙΚΗΣ Δεύτερος Γύρος - 30 Μαρτίου 2011

ΣΟΡΟΠΤΙΜΙΣΤΡΙΕΣ ΕΛΛΗΝΙΔΕΣ

ΔΙΠΛΩΜΑΤΙΚΗ ΕΡΓΑΣΙΑ. Τα γνωστικά επίπεδα των επαγγελματιών υγείας Στην ανοσοποίηση κατά του ιού της γρίπης Σε δομές του νομού Λάρισας

Instruction Execution Times

Δπηιέγνληαο ην «Πξνεπηινγή» θάζε θνξά πνπ ζα ζπλδέεζηε ζηελ εθαξκνγή ζα βξίζθεζηε ζηε λέα ρξήζε.

ΕΛΛΗΝΙΚΗ ΔΗΜΟΚΡΑΤΙΑ ΠΑΝΕΠΙΣΤΗΜΙΟ ΚΡΗΤΗΣ. Ψηφιακή Οικονομία. Διάλεξη 7η: Consumer Behavior Mαρίνα Μπιτσάκη Τμήμα Επιστήμης Υπολογιστών

department listing department name αχχουντσ ϕανε βαλικτ δδσϕηασδδη σδηφγ ασκϕηλκ τεχηνιχαλ αλαν ϕουν διξ τεχηνιχαλ ϕοην µαριανι

Code Breaker. TEACHER s NOTES

Άσκηση 1 - Μοπυοποίηση Κειμένου

ΣΤΥΛΙΑΝΟΥ ΣΟΦΙΑ

Εγκατάσταση λογισμικού και αναβάθμιση συσκευής Device software installation and software upgrade

ω ω ω ω ω ω+2 ω ω+2 + ω ω ω ω+2 + ω ω+1 ω ω+2 2 ω ω ω ω ω ω ω ω+1 ω ω2 ω ω2 + ω ω ω2 + ω ω ω ω2 + ω ω+1 ω ω2 + ω ω+1 + ω ω ω ω2 + ω

ΚΥΠΡΙΑΚΗ ΕΤΑΙΡΕΙΑ ΠΛΗΡΟΦΟΡΙΚΗΣ CYPRUS COMPUTER SOCIETY ΠΑΓΚΥΠΡΙΟΣ ΜΑΘΗΤΙΚΟΣ ΔΙΑΓΩΝΙΣΜΟΣ ΠΛΗΡΟΦΟΡΙΚΗΣ 19/5/2007

ΣΧΟΛΙΚΟ ΕΤΟΣ

ΚΥΠΡΙΑΚΗ ΕΤΑΙΡΕΙΑ ΠΛΗΡΟΦΟΡΙΚΗΣ CYPRUS COMPUTER SOCIETY ΠΑΓΚΥΠΡΙΟΣ ΜΑΘΗΤΙΚΟΣ ΔΙΑΓΩΝΙΣΜΟΣ ΠΛΗΡΟΦΟΡΙΚΗΣ 24/3/2007

Σχεδιασμός και Ανάπτυξη Ιστοτόπων. ΕΠΑ.Λ. ΑΛΙΜΟΥ Τομέας Πληροφορικής Κ. Φλώρος

Ειδικό πρόγραμμα ελέγχου για τον ιό του Δυτικού Νείλου και την ελονοσία, ενίσχυση της επιτήρησης στην ελληνική επικράτεια (MIS )

1. <body> 2. <header> 3. <h1> My Page </h1> 4. </header> 5. <section>

DOM. Γηδάζθνληεο: Π. Αγγειάηνο, Γ. Εήλδξνο Δπηκέιεηα δηαθαλεηώλ: Π. Αγγειάηνο. Σρνιή Ζιεθηξνιόγωλ Μεραληθώλ θαη Μεραληθώλ Υπνινγηζηώλ

LESSON 26 (ΜΑΘΗΜΑ ΕΙΚΟΣΙ ΕΞΙ) REF : 102/030/ November 2014

Συστήματα Διαχείρισης Βάσεων Δεδομένων

ΠΑΝΕΠΙΣΤΗΜΙΟ ΚΥΠΡΟΥ - ΤΜΗΜΑ ΠΛΗΡΟΦΟΡΙΚΗΣ ΕΠΛ 133: ΑΝΤΙΚΕΙΜΕΝΟΣΤΡΕΦΗΣ ΠΡΟΓΡΑΜΜΑΤΙΣΜΟΣ ΕΡΓΑΣΤΗΡΙΟ 3 Javadoc Tutorial

Η ΕΕ εγκρίνει νέο πρόγραµµα για ασφαλέστερη χρήση του Ίντερνετ και διαθέτει 55 εκατ. ευρώ ώστε να καταστεί ασφαλές για τα παιδιά

1 Είζοδορ ζηο Σύζηημα ΣΔΕΔ ή BPMS

Statistical Inference I Locally most powerful tests

LESSON 16 (ΜΑΘΗΜΑ ΔΕΚΑΕΞΙ) REF : 102/018/16-BEG. 4 March 2014

Dynamic types, Lambda calculus machines Section and Practice Problems Apr 21 22, 2016

ΤΟ ΣΤΑΥΡΟΔΡΟΜΙ ΤΟΥ ΝΟΤΟΥ ΤΟ ΛΙΜΑΝΙ ΤΗΣ ΚΑΛΑΜΑΤΑΣ

ΔΙΑΜΟΡΦΩΣΗ ΣΧΟΛΙΚΩΝ ΧΩΡΩΝ: ΒΑΖΟΥΜΕ ΤΟ ΠΡΑΣΙΝΟ ΣΤΗ ΖΩΗ ΜΑΣ!

Παλεπηζηήκην Πεηξαηώο Τκήκα Πιεξνθνξηθήο Πξόγξακκα Μεηαπηπρηαθώλ Σπνπδώλ «Πξνεγκέλα Σπζηήκαηα Πιεξνθνξηθήο»

ΓΕΩΠΟΝΙΚΟ ΠΑΝΕΠΙΣΤΗΜΙΟ ΑΘΗΝΩΝ ΤΜΗΜΑ ΕΠΙΣΤΗΜΗΣ ΤΡΟΦΙΜΩΝ ΚΑΙ ΔΙΑΤΡΟΦΗΣ ΤΟΥ ΑΝΘΡΩΠΟΥ

9.09. # 1. Area inside the oval limaçon r = cos θ. To graph, start with θ = 0 so r = 6. Compute dr

ΛΓΞΙΛΟΓΙΟ BIΒΛΙΟΥ Γ ΤΑΞΗΣ

6.1. Dirac Equation. Hamiltonian. Dirac Eq.

Adjectives. Describing the Qualities of Things. A lesson for the Paideia web-app Ian W. Scott, 2015

ΕΠΙΧΕΙΡΗΣΙΑΚΗ ΑΛΛΗΛΟΓΡΑΦΙΑ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑ ΣΤΗΝ ΑΓΓΛΙΚΗ ΓΛΩΣΣΑ

Fractional Colorings and Zykov Products of graphs

ΠΤΥΧΙΑΚΗ ΕΡΓΑΣΙΑ ΒΑΛΕΝΤΙΝΑ ΠΑΠΑΔΟΠΟΥΛΟΥ Α.Μ.: 09/061. Υπεύθυνος Καθηγητής: Σάββας Μακρίδης

4.6 Autoregressive Moving Average Model ARMA(1,1)

2.21 here εδώ 2.22 talk μιλάω 2.23 town πόλη 2.24 have fun διασκεδάζω 2.25 dinosaur δεινόσαυρος 2.26 be quiet κάνω ησυχία

ΤΕΧΝΟΛΟΓΙΚΟ ΠΑΝΕΠΙΣΤΗΜΙΟ ΚΥΠΡΟΥ ΤΜΗΜΑ ΝΟΣΗΛΕΥΤΙΚΗΣ

Transcript:

"Εθαξκνγέο Δηαδηθηύνπ" Βαζηθή δνκή θαη κνξθνπνίεζε ηεο HTML http://www.elizabethcastro.com/html5ed/examples/#c3 http://www.elizabethcastro.com/html5ed/examples/#c4 Ιωάλληλα 2008 Ι. Παπαδόπνπινο 1

ζήκαλζε κε ηε ρξήζε εηικεηών πνπ απνηεινύληαη από Σηνηρεία Ιδηόηεηεο Τηκέο <img src="myimage.jpg" /> <p>θείκελν παξαγξάθνπ</p> <a href="http://www.uoi.gr">ζύλδεζκνο</a> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 2

ξεκίνημα δημιοςπγίαρ ηηρ ιζηοζελίδαρ DOCTYPE: δειώλεηαη ζηελ αξρή ηωλ αξρείωλ HTML απζηεξή XHTML (strict) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> κεηαβαηηθή XHTML (transitional) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> XHTML πιαηζηνζπλόιωλ (frameset) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-frameset.dtd"> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 3

ξεκίνημα δημιοςπγίαρ ηηρ ιζηοζελίδαρ 1. άλνηγκα ηνπ αξρείνπ HTML κε έλαλ θεηκελνγξάθν 2. πιεθηξνιόγεζε ηνπ επηζπκεηνύ DOCTYPE 3. πιεθηξνιόγεζε ηεο εηηθέηαο <html xmlns="http://www.w3.org/1999/xhtml"> 4. εηζαγωγή κεξηθώλ θελώλ γξακκώλ 5. πιεθηξνιόγεζε ηεο εηηθέηαο </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 4

ξεκίνημα δημιοςπγίαρ ηηρ ιζηοζελίδαρ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> εδώ γξάθεηαη ν θύξηνο θώδηθαο HTML </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 5

δημιοςπγία ηων θεμελίων <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> </head> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 6

δημιοςπγία ηων θεμελίων <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> </head> <body> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 7

δήλωζη ηηρ κωδικοποίηζηρ σαπακηήπων <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> </head> <body> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 8

δημιοςπγία ηίηλος <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>antoni Gaudí - Introduction</title> </head> <body> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 9

δημιοςπγία επικεθαλίδων ενοηήηων <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>antoni Gaudí - Introduction</title> </head> <body> <h1>antoni Gaudí</h1> <h2>la Casa Milà</h2> <h2>la Sagrada Família</h2> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 10

ειζαγωγή παπαγπάθων <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>antoni Gaudí - Introduction</title> </head> <body> <h1>antoni Gaudí</h1> <p>many tourists are drawn to Barcelona to see Antoni Gaudí's incredible architecture.</p> <p>barcelona celebrates the 150th anniversary of Gaudí's birth in 2002.</p> <h2>la Casa Milà</h2> <p>gaudí's work was essentially useful. La Casa Milà is an apartment building and real people live there.</p> <h2>la Sagrada Família</h2> <p>the complicatedly named and curiously unfinished Expiatory Temple of the Sacred Family is the most visited building in Barcelona.</p> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 11

ονομαζία ζηοισείων id class κεκνλωκέλα ζηνηρεία id="όλνκα" νκάδεο ζηνηρείωλ class="όλνκα" θάζε αλαγλωξηζηηθό πξέπεη λα είλαη κνλαδηθό κπνξνύλ λα απνδνζνύλ ζε νπνηνδήπνηε ζηνηρείν ζπλήζωο ρξεζηκνπνηνύληαη ζηα ζηνηρεία div θαη span id κεηαηξέπεη ην ζηνηρείν ζε ζεκείν αγθύξωζεο id κέζν αιιειεπίδξαζεο κε ζελάξηα JavaScript Ιωάλληλα 2008 Ι. Παπαδόπνπινο 12

διαίπεζη μίαρ ζελίδαρ ζε ενόηηηερ ζηνηρείν div ελόηεηα = division <div class="class-name" id="id-name"> πεξηερόκελν ηεο ελόηεηαο </div> Η δηαίξεζε ζε ελόηεηεο γίλεηαη αληηιεπηή κεηά ηελ εθαξκνγή ζηπι CSS Ιωάλληλα 2008 Ι. Παπαδόπνπινο 13

διαίπεζη μίαρ ζελίδαρ ζε ενόηηηερ </head><body> <div id="gaudi"> <h1>antoni Gaudí</h1> <p>many tourists are drawn to Barcelona to see Antoni Gaudí's incredible architecture.</p> <p>barcelona celebrates the 150th anniversary of Gaudí's birth in 2002.</p> <div class="works"> <h2>la Casa Milà</h2> <p>gaudí's work was essentially useful. La Casa Milà is an apartment building and real people live there.</p> </div> <div class="works"> <h2>la Sagrada Família</h2> <p>the complicatedly named and curiously unfinished Expiatory Temple of the Sacred Family is the most visited building in Barcelona.</p> </div> </div> <body></html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 14

δημιοςπγία εμβόλιμων ζηπώζεων ζηνηρείν span ρξεζηκνπνηείηαη γηα ηε κνξθνπνίεζε εκβόιηκωλ ζηνηρείωλ Με ην ζηνηρείν span επεξεάδεηαη <span class="class-name" id="id-name"> ένα μέπορ ηος κειμένος</span> θαη όρη ην ζύλνιν κίαο ελόηεηαο Οη εκβόιηκεο ζηξώζεηο γίλεηαη αληηιεπηέο κεηά ηελ εθαξκνγή ζηπι CSS Ιωάλληλα 2008 Ι. Παπαδόπνπινο 15

δημιοςπγία εμβόλιμων ζηπώζεων </head><body> <div id="gaudi"> <h1>antoni Gaudí</h1> <p>many tourists are drawn to Barcelona to see Antoni Gaudí's incredible architecture.</p> <p>barcelona celebrates the 150th anniversary of Gaudí's birth in 2002.</p> <div class="works"> <h2>la Casa Milà</h2> <p>gaudí's work was essentially useful. La Casa Milà is an apartment building and <span class="emph">real people</span> live there.</p> </div> <div class="works"> <h2>la Sagrada Família</h2> <p>the complicatedly named and curiously unfinished Expiatory Temple of the Sacred Family is the <span class="emph">most visited</span> building in Barcelona.</p> </div> </div> <body></html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 16

πποζθήκη αλλαγήρ γπαμμήρ ζηνηρείν br break line αιιαγή γξακκήο <br /> Σηνηρεία όπωο ηα <p> θαη <hn> μεθηλνύλ απηόκαηα κε αιιαγή γξακκήο, ρωξίο λα απαηηείηαη ρξήζε ηνπ <br /> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 17

πποζθήκη αλλαγήρ γπαμμήρ </head><body> <div id="toc">antoni Gaudí<br />La Casa Milà<br />La Sagrada Família</div> <div id="gaudi"> <h1>antoni Gaudí</h1> <p>many tourists are drawn to Barcelona to see Antoni Gaudí's incredible architecture.</p> <p>barcelona celebrates the 150th anniversary of Gaudí's birth in 2002.</p> <div class="works"> <h2>la Casa Milà</h2> <p>gaudí's work was essentially useful. La Casa Milà is an apartment building and <span class="emph">real people</span> live there.</p> </div> <div class="works"> <h2>la Sagrada Família</h2> <p>the complicatedly named and curiously unfinished Expiatory Temple of the Sacred Family is the <span class="emph">most visited</span> building in Barcelona.</p> </div> </div> <body></html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 18

πποζθήκη ζσολίων έλαξμε ζρνιίνπ <!-- ηέινο ζρνιίνπ --> Τα ζρόιηα δελ είλαη άκεζα νξαηά ζην θπιινκεηξεηή, όκωο κπνξεί θαλείο λα ηα δεη ζηνλ θώδηθα HTML (π.ρ. κε ηε ιεηηνπξγία View Source) Ιωάλληλα 2008 Ι. Παπαδόπνπινο 19

πποζθήκη ζσολίων </head><body> <!-- εδώ τοποθετείται ο πίνακας περιεχομένων. Σε ένα πραγματικό κείμενο θα ήταν μεγαλύτερος --> <div id="toc">antoni Gaudí<br />La Casa Milà<br />La Sagrada Família</div> <div id="gaudi"> <h1>antoni Gaudí</h1> <p>many tourists are drawn to Barcelona to see Antoni Gaudí's incredible architecture.</p> <p>barcelona celebrates the 150th anniversary of Gaudí's birth in 2002.</p> <div class="works"> <h2>la Casa Milà</h2> <p>gaudí's work was essentially useful. La Casa Milà is an apartment building <body></html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 20

πποζθήκη "ζςμβοςλών επγαλείος" Η ηδηόηεηα title ζηνηρείνπ εηζάγεη "ζπκβνπιέο εξγαιείνπ" (tool tips) Εκθαλίδνληαη όηαλ ην πνληίθη βξεζεί επάλω ζην ελ ιόγω ζηνηρείν <img src="image.jpg" alt="" title="εικόνα"> <p title="η ζςμβοςλή ηος επγαλείος "> Άπηή είλαη κία παξάγξαθνο κε tool tip</p> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 21

πποζθήκη "ζςμβοςλών επγαλείος" </head><body> <!-- εδώ τοποθετείται ο πίνακας περιεχομένων. Σε ένα πραγματικό κείμενο θα ήταν μεγαλύτερος --> <div id="toc" title="table of Contents"> Antoni Gaudí<br />La Casa Milà<br />La Sagrada Família</div> <div id="gaudi"> <h1>antoni Gaudí</h1> <p>many tourists are drawn to Barcelona to see Antoni Gaudí's incredible architecture.</p> <p>barcelona celebrates the 150th anniversary of Gaudí's birth in 2002.</p> <div class="works"> <h2>la Casa Milà</h2> <p>gaudí's work was essentially useful. La Casa Milà is an apartment building <body></html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 22

Βαζική μοπθοποίηζη ηηρ HTML Η κνξθνπνίεζε γίλεηαη ελ γέλεη κε CSS Γηα θάπνηα βαζηθά είδε κνξθνπνίεζεο ή γηα θάπνηεο απιέο δνπιεηέο ρξεζηκνπνηνύληαη ζηνηρεία HTML Ιωάλληλα 2008 Ι. Παπαδόπνπινο 23

Βαζική μοπθοποίηζη ηηρ HTML ένηονο θείκελν: <b> (bold) ιηγόηεξν ζπλεζηζκέλν ζηνηρείν: <strong> πιάγην θείκελν: <i> (italic) ιηγόηεξν ζπλεζηζκέλα ζηνηρεία: <em> (emphasize) <cite> (citation) <dfn> (definition) <var> (variable) <address> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 24

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>bold and Italic text</title> </head> <body> <h1>barcelona Night Life</h1> <p>barcelona is such a great place to live. People there really put a premium on <b>socializing</b>. Imagine it being more important to go out with your friends than to get that big promotion. Even when you're, gasp, <i>pushing 30</i>. They say there are more bars in Barcelona than in the rest of the European community <i>combined</i>.</p> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 25

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>strong and Emphasized text</title> </head> <body> <h1>barcelona Night Life</h1> <p>barcelona is such a great place to live. People there really put a premium on <strong>socializing</strong>. Imagine it being more important to go out with your friends than to get that big promotion. Even when you're, gasp, <em>pushing 30</em>. They say there are more bars in Barcelona than in the rest of the European community <em>combined</em>.</p> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 26

Βαζική μοπθοποίηζη ηηρ HTML Σηε κεηαβαηηθή HTML κπνξεί λα αιιάμεη ην κέγεζνο ηνπ θεηκέλνπ κε ηα ζηνηρεία <big> <small> π.ρ. ην θείκελν είλαη <big>κεγαιύηεξν εδώ</big> θαη <small>κηθξόηεξν εδώ</small> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 27

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>strong and Emphasized text</title> </head> <body> <h1>barcelona Night Life</h1> <p>barcelona is such a great place to live. People there really put a premium on <strong>socializing</strong>. Imagine it being more important to go out with your friends than to get that big promotion. Even when you're, gasp, <em>pushing 30</em>. They say there are more bars in Barcelona than in the rest of the European community <em>combined</em>.</p> <p><big>don't get me wrong,</big> I don't mean that everyone gets drunk all the time--bars are for hanging out and talking or for having a cup of coffee (espresso, of course).</p> <p><small>the opinions expressed on this page are mine and mine alone. </small></p> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 28

Βαζική μοπθοποίηζη ηηρ HTML ρξήζε γξακκαηνζεηξάο ζηαζεξνύ πιάηνπο <tt> <code> <kbd> <samp> typewriter text γηα πεγαίν θώδηθα γηα νδεγίεο πιεθηξνινγίνπ sample (δείγκα) Τα ζηνηρεία απηά είλαη εκβόιηκα (inline) Ιωάλληλα 2008 Ι. Παπαδόπνπινο 29

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>using monospaced fonts</title> </head> <body> <h2>perl Tutorial, Lesson 1</h2> <p>if you're on a UNIX server, every Perl script should start with a shebang line that describes the path to the Perl interpreter on your server. The shebang line might look like this:</p> <p><code>#!/usr/local/bin/perl</code></p> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 30

Βαζική μοπθοποίηζη ηηρ HTML ρξήζε πξνκνξθνπνηεκέλνπ θεηκέλνπ <pre> ην θείκελό κνπ όπωο αθξηβώο έρεη κνξθνπνηεζεί </pre> Τν ζηνηρείν <pre> είλαη επηπέδνπ κπινθ Ιωάλληλα 2008 Ι. Παπαδόπνπινο 31

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>showing code with the pre tag</title> </head> <body> <p>here's the first part of the Cat and Otter Bistro script (see the WAP/WML chapter), where the variables are declared, and the $number variable is screened to make sure it's actually a number: <pre>my $number = param('number'); my $smoke = param('smoke'); my $dinner_index = param('dinner_index'); $number =~ /([0-9]*)/ ; $number = $1; </pre> <p>here's the <a href="precode.html">rest of the script</a>, in case you're interested. </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 32

Βαζική μοπθοποίηζη ηηρ HTML Παξάζεζε απηνύζηνπ θεηκέλνπ ζε επίπεδν κπινθ <blockquote> νη παξαηηζέκελεο παξάγξαθνη ζε εζνρή εκβόιηκν <q> ηνπνζεηνύληαη απηνκάηωο εηζαγωγηθά Ιωάλληλα 2008 Ι. Παπαδόπνπινο 33

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>creating a block quote</title> </head> <body> <p>sometimes I get to the point where I'm not sure anything matters at all. Then I read something like this and I am inspired: </p> <blockquote cite="http://www.kingsolver.com"> <p>it's not hard to figure out what's good for kids, but amid the noise of an increasingly antichild political climate, it can be hard to remember just to go ahead and do it: for example, to vote to raise your school district's budget, even though you'll pay higher taxes. (If you're earning enough to pay taxes at all, I promise, the school needs those few bucks more than you do.) To support legislators who care more about afterschool programs, affordable health care, and libraries than about military budgets and the Dow Jones industrial average. To volunteer time and skills at your neighborhood school and also the school across town. To decide to notice, rather than ignore it, when a neighbor is losing it with her kids, and offer to babysit twice a week. This is not interference. Getting between a ball player and a ball is interference. The ball is inanimate.</p> </blockquote> <p>this is from Barbara Kingsolver's brilliant collection of essays, <cite>high Tide in Tucson</cite> (1995, HarperCollins)</p>. </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 34

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>creating a block quote</title> </head> <body> <p>and then she said <q>have you read Kingsolver's <q>high Tide in Tucson</q>? It's inspiring.</q></p> <p>she tried again, this time in French: <q lang="fr">avez-vous lu le livre <q lang="fr">high Tide in Tucson</q> de Kingolver? C'est inspirational.</q></p> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 35

Βαζική μοπθοποίηζη ηηρ HTML Εθζέηεο (superscript) <sup> Τξηώλπκν: a x<sup>2</sup> + β x + γ Δείθηεο (subscript) <sub> C<sub>ij</sub>=A<sub>ij</sub>+B<sub>ij</sub> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 36

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>using superscripts and subscripts</title> </head> <body> <h1>famous Catalans</h1> <p>when I was in the sixth grade, I played the cello. There was a teacher at school who always used to ask me if I knew who "Pablo Casals" was. I didn't at the time (although I had met Rostropovich once at a concert). Actually, Pablo Casals' real name was <i>pau</i> Casals, Pau being the Catalan equivalent of Pablo<sup>1</sup>.</p> <p>in addition to being an amazing cellist, Pau Casals is remembered in this country for his empassioned speech against nuclear proliferation at the United Nations<sup>2</sup> which he began by saying "I am a Catalan. Catalonia is an oppressed nation."</p> <p><sup>1</sup>it means Paul in English.<br /> <sup>2</sup>in 1963, I believe.</p> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 37

Βαζική μοπθοποίηζη ηηρ HTML Επηζήκαλζε αιιαγκέλνπ θεηκέλνπ Κείκελν πνπ έρεη παξεκβιεζεί <ins> Κείκελν πνπ έρεη δηαγξαθεί <del> (inserted) (deleted) ζπλήζωο ρξεζηκνπνηείηαη από δηθεγόξνπο θαη ζπκβνιαηνγξάθνπο Ιωάλληλα 2008 Ι. Παπαδόπνπινο 38

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="fr"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>creating a block quote</title> </head> <body> <p><big>i promise to do all of my homework,<ins> all of my chores,</ins> clean the cat litter, and not watch more than <del>six</del> a half hour<del>s</del> of tv.</big></p> <p>signed</p> </body> </html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 39

Βαζική μοπθοποίηζη ηηρ HTML Επεμήγεζε ζπληκήζεωλ (abbreviation) <abbr> Επεμήγεζε αξθηηθόιεμωλ (acronym) <acronym> Χξεζηκνπνηνύληαη ζπλήζωο ζε ζπλδπαζκό κε ηελ ηδηόηεηα title πνπ παξέρεη "ζπκβνπιέο εξγαιείνπ" Ιωάλληλα 2008 Ι. Παπαδόπνπινο 40

Βαζική μοπθοποίηζη ηηρ HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>creating a block quote</title> </head> <body> <p><abbr title="lyndon Baynes Johnson">LBJ</abbr> took the <abbr title="interborough Rapid Transit">IRT</abbr> down to 4th Street <abbr title="united States of America">USA</abbr>. <br />When he got there, what did he see? <br />The youth of America on <abbr title="d-lysergic Acid Diethylamide">LSD</abbr>.</p> <p>--hair, the Musical, 1967</p> <p>or perhaps you'd rather talk about something slightly less political, like <acronym title="light Amplification By Stimulated Emission of Radiation">laser</acronym>, or <acronym title="radio Detection And Ranging ">radar</acronym>, or <acronym title="self-contained Underwater Breathing Apparatus">scuba</acronym>? </p> </body></html> Ιωάλληλα 2008 Ι. Παπαδόπνπινο 41