4 < 5 Webdesign | start | Webdesign 5 > 6

CSS-Befehle | Veriante 1: Gestaltung der Struktur durch Inline-styles

Inlinestyles sind die Lösung für einmalige Gestaltungsvorkommen in einer Datei

Die Lösung ist eine Inline-CSS-Befehl

Der Befehl kann direkt in den HTML-Steuerbefehl geschrieben werden und lautet: style="color:blue;"

Erklärung

• style signalisiert dem HTML-Dokument, dass jetzt ein CSS-Befehl folgt. Zugewiesen wird der Befehl durch ="..."
• Der CSS-Befehl lautet: color. Der Wert wird hinter dem Doppelpunkt angegeben (blue)
  
• Der Strichpunkt beendet den Befehl.
• Nach dem Strichpunkt können weitere Befehle folgen (Beispiele siehe unten)

Ausführung

<h1 style="color:blue;">Gruselett</h1>

Ergebnis: Die Überschrift wird in größerer Schrift und fett hervorgehoben angezeigt.

Erklärung: Eine Voreinstellung für die Anzeige von Elementen erzeugt aus h1, h2, h3 usw. Überschriften mit abgestuftem Aussehen. Die Voreinstellungen können beeinflusst werden.

Einschätzung

Aufgabe: Stellen Sie sich vor, Sie wollen einen Text mit mehreren hundert Überschriften bearbeiten. Alle Überschriften sollen die Farbe blau erhalten. Beurteilen Sie die Ökonomie dieses Verfahrens. Beschreiben Sie einen Fall, der die hier gezeigte Farbzuweisung rechtfertigt.

Einige CSS-Befehle zur Erweiterung der Inline-Styles

Schriftfarbe: color: green
Schriftart: font-family: arial
Schriftgröße: font-size: 12px
Hintergrundfarbe: background-color: yellow
Rahmen: border: solid 1px red (Einem Befehl können mehrere Werte mit Leerzeichen folgen. Hier Randart, Randstärke, Randfarbe)