Einführung HTML
20.01.2015 Sd 9
Die erste Web-Seite
Notepad++
mit Grundgerüst
Ergebnis im
Browser
Einführung HTML Zeilenumbrüche in HTML
Zeilenumbrüche im HTML-Quelltext werden vom Browser ignoriert.
Hallo.
Hallo Welt.
Ende.
Hallo.
Hallo Welt.Ende.
Hallo.Hallo Welt.Ende.
Beide HTML-Codes führen
zur gleichen Ausgabe, nämlich:
Einführung HTML Textabsätze mit <p>-Tag
Absätze werden immer mit <p> (öffnend) und </p> (schließend) formatiert:
<html>
<head>
<title>Test-Seite</title>
</head>
<body>
<p>Ich bin ein Absatz.</p>
<p>Ich bin der nächste Absatz.</p>
</body>
</html>
Einführung HTML Kommentare in HTML
Kommentare werden mit <!-- geöffnet und mit --> geschlossen.
<html>
<head>
<title>Test-Seite</title>
</head>
<body>
<p>Ich bin ein Absatz.</p>
<!-- Das war der 1. Abs. -->
<p>Ich bin der naechste Absatz.</p>
</body>
</html>
Taucht auf der HTML-Seite gar nicht auf
Einführung HTML Überschriften mit <h1> bis <h6>
Überschriften werden mit <h1> bis <h6> (öffnend) und </h1> bis
</h6> (schließend) formatiert:
<html>
<head>
<title>Test-Seite</title>
</head>
<body>
<h1>Hunde</h1>
<p>Ich mag Hunde, vor allem Schaeferhunde und Doggen.</p>
<h2>Schaeferhunde</h2>
<p>Schaeferhunde sind so suess und putzig.</p>
<h2>Doggen</h2>
<p>Doggen sind auch suess, aber ziemlich hoch gewachsen.</p>
<h1>Voegel</h1>
<p>...</p>
</body>
</html>
Einführung HTML
20.01.2015 Sd 14
Text Formatierungen
Tag Info
<!-- Kommentar Kommentar --> Html kommentieren, wird im Browser nicht angezeigt
<h1>Überschrift Stärke 1</h1>
<hr size=„2“ color=„blue“>
Überschriften mit Stärke/Formatierung 1…7
Trennlinie
<p>………</p>
<div>……….</div>
<br>
Absatz, Block, div kann geschachtelt werden, p nicht
Zeilenumbruch erzwingen, ohne Endetag
<b>der Text ist dick</b>
<u>der Text ist unterstrichen</u>
<i>der Text ist kursiv</i>
<big>der Text ist besonders dick/Gross</big>
dick
unterstrichen kursiv
besonders dick
<ul>Text…………Text</ul> Text nach rechts einrücken
Befehl & Attribut Hinweis
<font>………</font> Schriftart einstellen (wird später durch css Stylesheets ersetzt)
<font face=„arial, verdana, tahoma“
size=„5“ color=„red“>……….</font>
Alles, was zwischen <font> und </font> steht, wird in arial, oder…., Schriftgröße 5 und Farbe Rot
geschrieben
Einführung HTML
• Ungeordnete
<ul>
<li>Klasse 8a</li>
<li>Klasse 8b</li>
</ul>
So sieht es dann aus :
• Klasse 8a
• Klasse 8b
Weitere Möglichkeiten:
• Geordnete
<ol>
<li>Klasse 8a</li>
<li>Klasse 8b</li>
</ol>
So sieht es dann aus : 1. Klasse 8a 2. Klasse 8b
20.01.2015 Sd 15