medien- technik millennium edition 1 minimales html-dokument datei: neueseite.htm wie man einen...

Post on 05-Apr-2015

102 Views

Category:

Documents

0 Downloads

Preview:

Click to see full reader

TRANSCRIPT

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()">

top related