Medien- Technik Millennium Edition 1 Minimales HTML-Dokument Datei: NeueSeite.htm Wie man einen...
-
Upload
meta-kesler -
Category
Documents
-
view
102 -
download
0
Transcript of Medien- Technik Millennium Edition 1 Minimales HTML-Dokument Datei: NeueSeite.htm Wie man einen...
1
Medien-Technik
Millennium
Edition Minimales HTML-Dokument
<html><head>
</head><body>
</body></html>
Datei:NeueSeite.htm
Wie maneinen Seitentitel einfügt
<title> Seitentitel </title>
2
Medien-Technik
Millennium
Edition
<html><head><title> Seitentitel </title>
</head><body>
</body></html>
Datei:NeueSeite.htm
3
Medien-Technik
Millennium
Edition
<html><head><title> Seitentitel </title>
</head><body>
</body></html>
Datei:NeueSeite.htm
Wie maneine Überschrift einfügt
Überschrift H1
<h1> Überschrift H1 </h1>
4
Medien-Technik
Millennium
Edition
<html><head><title> Seitentitel </title>
</head><body><h1> Überschrift H1
</h1>
</body></html>
Datei:NeueSeite.htm
5
Medien-Technik
Millennium
Edition
<html><head><title> Seitentitel </title>
</head><body><h1> Überschrift H1
</h1>
</body></html>
Datei:NeueSeite.htm
Wie maneinen Absatz einfügt
Es gibt 6 Überschriftengrößen. H1 ist die größte, H6 die kleinste.
<p> Es gibt 6 Überschriftengrößen.H1 ist die größte, H6 diekleinste. </p>
6
Medien-Technik
Millennium
Edition
<html><head><title> Seitentitel </title>
</head><body><h1> Überschrift H1
</h1><p> Es gibt 6 ÜberschH1 ist die größte, H6kleinste. </p></body></html>
Datei:NeueSeite.htm
Wie manein Bild einfügt
<body><h1> Überschrift H1
</h1><p> Es gibt 6 ÜberschH1 ist die größte, H6kleinste. </p>
<h6> Dies ist eine Über
</body></html>
<p><img src=“bild.gif“></p>
URL = Universal Resource Locator
7
Medien-Technik
Millennium
Edition
<body><h1> Überschrift H1
</h1><p> Es gibt 6 ÜberschH1 ist die größte, H6kleinste. </p>
<h6> Dies ist eine Über
<p><img src=“bild.gif“></p>
</body></html>
Datei:NeueSeite.htm
8
Medien-Technik
Millennium
Edition
<body><h1> Überschrift H1
</h1><p> Es gibt 6 ÜberschH1 ist die größte, H6kleinste. </p>
<h6> Dies ist eine Über
<p><img src=“bild.gif“></p>
</body></html>
Datei:NeueSeite.htm
Wie manein Html-Editor benutzt
9
Medien-Technik
Millennium
Edition
Gratis:
Frontpage Express
Netscape Composer
Shareware:
Hotmetal
Käuflich:
MS Frontpage
MS Visual Interdev
Adobe PagemillHotmetal Pro
Wie manden Hintergrund färbt
10
Medien-Technik
Millennium
Edition
Wie manden Hintergrund färbt
# XX XX XX
R G B
11
Medien-Technik
Millennium
Edition
12
Medien-Technik
Millennium
Edition
<strong> ... </strong>
<em> ... </em>
<u> ... </u>
<html>
<head>
</body>
</html>
</head>
<body>
<title> ... </title>
<meta ....>
<h1> ... </h1>
....
<h6> ... </h6>
<p> ... </p>
<img src=url height= width= alt= >
Zusammenfassung:
13
Medien-Technik
Millennium
Edition
Begriff:Offener Standard
14
Medien-Technik
Millennium
Edition Wie man eine Tabelle erstellt
Tabellen sindwichtigesFormatierungs-hilfsmittel fürHTML-Seiten
</table>
<table>
<tr>
</tr><tr>
</tr>
<td>
</td>
<td>
</td>
<td>
</td><td>
</td>
<td>
</td>
<td>
</td>
15
Medien-Technik
Millennium
Edition
<table border="1"> <tr> <td>Dies ist ein Blindtext. Er dient ausschließlich dazu, das Aussehen der Schrift zu demonstrieren</td> <td>numnoi numnoi</td> <td>Dies ist eine einfache Tabelle ohne besondere Angaben zu das Aussehen</td> </tr> <tr> <td>Die Darstellung dieser Tabelle wird dem Browser überlassen.</td> <td><img src="bild.gif" width="125" height="126"></td> <td>In einer Tabellenzelle kann beliebiger Text stehen, auch bilder, weitere Tabellen usw.</td> </tr></table>
Wie man eine Tabelle erstellt
16
Medien-Technik
Millennium
Edition Wie man eine Tabelle erstellt
Tabelle TabellenzeileTabellenstart </table>
Nonterminal(Rechteck)
Terminal(runde Ecken)
Syntax-Diagramme
17
Medien-Technik
Millennium
Edition Wie man eine Tabelle erstellt
Tabelle TabellenzeileTabellenstart </table>
Nonterminal(Rechteck)
Terminal(runde Ecken)
Tabellenzeile <tr> Tabellenzelle </tr>
Tabellenstart <table
Tab-Param
>
noch nicht definiert
18
Medien-Technik
Millennium
Edition Tabellen-Feinheiten
<table border="10"cellpadding="10"cellspacing="10"width="400"bgcolor="yellow"bordercolor="blue"bordercolordark="red"bordercolorlight="green">
<td bgcolor="#FFFFFF" bordercolor="#00FFFF" bordercolordark="#00FF00" bordercolorlight="#FFFF00"> Diese Zelle ...</td>
<td align="center“colspan="2“background="bluenice.gif">Verbundene Zelle colspan=2</td>
19
Medien-Technik
Millennium
EditionLiteraturempfehlung
http://www.teamone.de/selfaktuell/
Weitere Themen:
CSSCascading Style Sheets
JavaScript
DHTMLDynamic HTML
Document ObjectModel
20
Medien-Technik
Millennium
Edition
<HEAD><STYLE type="text/css">H1 {border-width: 1; border: solid; text-align: center}</STYLE></HEAD>
<HEAD><LINK rel="stylesheet“href="common.css“type="text/css"></HEAD>
Cascading Style Sheets: Externes Style Sheet
<STYLE>H1{ border-width: 1; border: solid; text-align: center}</STYLE>
Datei:common.css
21
Medien-Technik
Millennium
Edition
René Descartes1596-1650
Cogito,ergo sum!
Res cogitans: denkende SubstanzSubjekt, zur Erkenntis fähig
Res extensa: ausgedehnte Substanz
(erkennbare) Objekte
Immanuel Kant1724-1804
Kategorischer Imperativ
Was für Descartes das Objekt,ist für Immanuel Kant die Erscheinung,während als Objekt bei ihm das im Aktder Vorstellung vorgestellteGedankending zu verstehen ist.In der modernen Sprachphilosophieund in der Logik wird jeder Gegenstand,auf den unterscheidend Bezuggenommen werden kann, als Objekt
bezeichnet. Informatik: Programmiersprachen-Objektdefiniert durch Eigenschaften, Methoden, Ereignisse
22
Medien-Technik
Millennium
EditionBrowser-Objekt: window
H4
H5
H6
P
Table
Td
getAttribute()
setAttribute()
removeAttribute()
S
S.H1
S(“H1“)
S(0)
23
Medien-Technik
Millennium
Edition
window.document
Liste aller HTML-Elemente HTMLHEADTITLEMETAMETASTYLEBODYH1PH6PIMGSTRONGEMUPEMSTRONGUP
window.document.all(11)
JavaScript, VBScript:Manipulation dieser Objekte
24
Medien-Technik
Millennium
Edition
Document Eigenschaften:alinkColor (Farbe für Verweise beim Anklicken)bgColor (Hintergrundfarbe)charset (verwendeter Zeichensatz)cookie (beim Anwender speicherbare Zeichenkette)defaultCharset (normaler Zeichensatz)fgColor (Farbe für Text)lastModified (letzte Änderung am Dokument)linkColor (Farbe für Verweise)referrer (zuvor besuchte Seite)title (Titel der Datei)URL (URL-Adresse der Datei)vlinkColor (Farbe für Verweise zu besuchten Zielen)
<p><script language="JavaScript"><!--document.writeln('alinkColor=',document.alinkColor,'<br>');document.writeln('bgColor=',document.bgColor,'<br>');document.writeln('charset=',document.charset,'<br>');document.writeln('cookie=',document.cookie,'<br>');document.writeln('defaultCharset=',document.defaultCharset,'<br>');document.writeln('fgColor=',document.fgColor,'<br>');document.writeln('lastModified=',document.lastModified,'<br>');document.writeln('linkColor=',document.linkColor,'<br>');document.writeln('referrer=',document.referrer,'<br>');document.writeln('title=',document.title,'<br>');document.writeln('URL=',document.URL,'<br>');document.writeln('vlinkColor=',document.vlinkColor,'<br>');// --></script></p>
25
Medien-Technik
Millennium
Edition
Document Unterobjekte:
allanchorsappletsareasembedsformsimages Feld aller Bilder, images.length= Anzahl, images(0) das erste!layerslinksplugins
<p><script language="JavaScript"><!--document.writeln('images(0).src=',document.images(0).src,'<br>');UrBild = document.images(0).src;// --></script></p>
<script language="JavaScript"><!--function wechsel(){ if (document.images(0).src==UrBild) document.images(0).src='bild2.jpg'; else document.images(0).src='bild.gif';}// --></script>
<img src="bild.gif" alt="bild.gif (1250 bytes)“width="125" height="126"onclick="wechsel()">