CSS: HTML mit Stil
Damit werden Farben, Grössen, Schriftarten etc. von HTML-Elementen festgelegt.
- Fügen Sie folgende Zeile zwischen <head> und </head> in Ihrer Datei hello.html ein.
<link rel="stylesheet" href="hello.css">
- Clicken Sie dann mit gedrückter Ctrl-Taste im HTML-Code auf den Dateiname hello.css, um diese Datei anzulegen.
- Fügen Sie dann folgenden Inhalt ein:
body { /* HTML tag body */ background-color: beige; } .wichtig { /* Klasse wichtig, einem HTML-Element class="wichtig" hinzufügen, um wichtig zu sein */ color: red; /* Text farbe */ font-weight: bold; /* Fett */ } #meinDing { /* Ein einziges HTML-Element mit id="meinDing" */ background-color:lightseagreen; }
- Speichern Sie alle Dateien und betrachten Sie die Seite im Browser (idealerweise mit dem LiveServer).
- Fügen Sie dann einigen HTML-Tags zwischen < und > das Attribut
class=“wichtig”hinzu, z.B. wie folgt
<p class="wichtig">Mit p macht man einzelne Abschnitte</p>
- Testen Sie (eventuell muss die Seite mit Ctrl-Shift-R neu geladen werden.)
- Fügen Sie die Klasse einem weiteren Element hinzu.
- Fügen Sie einem einzigen Element das Attribut
id=“meinDing”hinzu und testen Sie.
<p id="meinDing">Und hier noch ein Bild mit dem Dokuwiki-Logo</p>
Resourcen zu CSS
Websuche mit was man eben sucht plus die Begriffe “CSS” und/oder “HTML”. Z.B. “CSS position hintergrundbild”.