Türchen 2: Der CSS-Schneemann - CONVERT - Wir machen Sie im Internet sichtbar!

Türchen 2: Der CSS-Schneemann

Der CSS-Schneemann

Türchen 2

Die heutige Geschichte

Der CSS-Schneemann

Emily entdeckte, wie sie mit CSS wunderbare Dinge auf dem Bildschirm zaubern konnte. Sie erstellte einen Schneemann aus reinem Code und nannte ihn „Frosty.css“.

Die Hintergründe

CSS zum Styling

CSS, die Abkürzung für „Cascading Style Sheets“ (zu Deutsch: „Kaskadierende Stilvorlagen“), ist eine Gestaltungssprache, die in Verbindung mit HTML verwendet wird, um das Aussehen und die Darstellung von Webseiten zu definieren. CSS ermöglicht es, das Layout, die Farben, Schriftarten und andere visuelle Aspekte einer Webseite zu kontrollieren, ohne den eigentlichen Inhalt der Seite zu verändern. Hier ist eine Erklärung, wie CSS funktioniert:

1. Trennung von Inhalt und Gestaltung

Eine der wichtigsten Funktionen von CSS besteht darin, den Inhalt einer Webseite von seiner Gestaltung zu trennen. Das bedeutet, dass HTML für die Struktur und den Inhalt der Seite verantwortlich ist, während CSS für das Erscheinungsbild und die Stilgebung verantwortlich ist.

2. Selektoren und Regeln

CSS verwendet Selektoren, um HTML-Elemente auszuwählen, auf die die Gestaltungsregeln angewendet werden sollen. Diese Selektoren werden dann mit Deklarationen kombiniert, die die gewünschten Stileigenschaften festlegen. Eine typische CSS-Regel sieht so aus:

				
					selector {
  property: value;
}
				
			
  • Der „Selektor“ wählt die HTML-Elemente aus, auf die die Regel angewendet wird (z.B., p für Absätze oder .class für Elemente mit einer bestimmten Klasse).
  • Die „property“ (Eigenschaft) definiert, welche Stilattribute geändert werden sollen (z.B., color für die Textfarbe oder font-size für die Schriftgröße).
  • Der „value“ (Wert) gibt an, welchen Wert die Eigenschaft haben soll (z.B., blue für die Textfarbe oder 16px für die Schriftgröße).

3. Kaskadierung und Priorität

Das „Cascading“ in CSS bezieht sich auf die Art und Weise, wie Stilregeln angewendet werden, wenn sie in Konflikt geraten. CSS-Regeln können aus verschiedenen Quellen stammen, wie externen CSS-Dateien, internen <style>-Tags oder Inline-Stilen. Wenn mehrere Regeln auf dasselbe Element angewendet werden, wird die spezifischere Regel normalerweise Vorrang haben.

4. Erbschaft

CSS ermöglicht auch die Vererbung von Stilregeln. Wenn Sie beispielsweise einem übergeordneten HTML-Element einen Stil zuweisen, können seine untergeordneten Elemente diesen Stil erben, es sei denn, sie haben eigene spezifische Stile.

5. Medienabfragen

CSS ermöglicht es, Stile auf verschiedene Bildschirmgrößen und Gerätetypen anzupassen. Dies geschieht mithilfe von Medienabfragen, die es ermöglichen, spezielle Stile für Desktop-Computer, Tablets, Smartphones und andere Geräte festzulegen.

CSS ist von entscheidender Bedeutung, um Webseiten visuell ansprechend zu gestalten und eine konsistente Darstellung auf verschiedenen Geräten sicherzustellen. Zusammen mit HTML und JavaScript bildet CSS die Grundlage für die Entwicklung von modernen, interaktiven und attraktiven Webseiten.

Wo wollen Sie denn hin

Es gibt weitere Artikel

wir wissen noch viel mehr

Barrierefreiheit im Netz

Eine Einführung in barrierefreie Webseiten Was bedeutet Barrierefreiheit im Web? In einer zunehmend digitalisierten Welt ist der Zugang zum Internet für viele Menschen ein unverzichtbarer Bestandteil des täglichen Lebens. Doch während für einige das Surfen

Klingt interessant »

Pflichtelemente auf einer Website

Was muss auf eine Website? Informationspflichten & rechtliche Anforderungen Bevor du voller Enthusiasmus Inhalte erstellst und deine Online-Präsenz gestaltest, gibt es einige wichtige Aspekte zu beachten. Abgesehen von der kreativen Gestaltung und dem informativen Mehrwert,

Klingt interessant »
Nach oben scrollen