Einführung HTML
09.07.2015 Sd 53
StyleSheets (Formatvorlagen)
<head>
<title>Einführung StyleSheets</title>
<style type=„text/css“>
body {background-color: yellow; margin-left: 20px;}
p {font-family: Arial; font-size: 12pt; color: blue;}
h1, h2 {font-family: Arial, Helvetica;}
</style>
</head>
In der StyleSheet-Anweisung:
p.zitat {font-family: Times; font-size: 10pt; color: blue;}
p.schatten {font-family: Arial; font-size: 12pt; color: red;}
li.kreis {list-style-type: circle;}
Im HTML-Text:
<p class=„zitat“>Man sieht sich!</p>
<p class=„schatten“>Absatz mit Grauschattierung</p>
<li class=„kreis“>Listeneintrag mit Kreis</li>
Klassen bilden:
Interne Styles: Verweis auf externe Style Sheets:
Textdatei mit der Endung css erstellen
Im head dann folgende Anweisung aufnehmen:
<link rel=„stylesheet type=„text/css“ href=„meinstyle.css“>
In diesem externen Stylesheet wird dann die Anweisung
<style…..>………..</style>
Weggelassen und nur die Style-Anweisungen aufgenommen
<p style=„font-family: Arial; text-align: center;“>
Das ist ein spezieller Absatz
</p>
Inline-Style:
(geeignet für einmalige Formatierung,
einfach in beliebigen Tags das style-Attribut verwenden)
Style-Sheets werden zur Formatierung statt des veralteten font-Tags verwendet
Für ein Dokument können mehrere Style-Sheets existieren!
1 Stylesheet kann für mehrere Dokumente verwendet werden!