Einführung in CSS zur Gestaltung von Webseiten
CSS (Cascading Style Sheets) verleiht Ihren Webseiten das visuelle Erscheinungsbild. Während HTML die Struktur bereitstellt, steuert CSS Farben, Schriftarten, Abstände und Layout – ähnlich wie Dekoration und Inneneinrichtung das Aussehen eines Hauses bestimmen.
Hinzufügen von CSS zur Gestaltung von HTML
CSS kann auf drei Hauptarten angewendet werden.
Inline-Stile
Verwendung des style-Attributs zur schnellen Gestaltung eines einzelnen Elements.
index.html
Interne Stile
Einfügen eines <style>-Blocks im <head>, um Elemente auf derselben Seite zu gestalten.
index.html
Externe Stylesheets
Für größere Projekte sollte das CSS in einer separaten Datei gespeichert und mit dem HTML verknüpft werden.
Bitte die Dateien index.html und index.css im Beispiel überprüfen.
index.html
index.css
CSS-Selektoren
Selektoren legen fest, welche Elemente bestimmte Stile erhalten.
Elementselektor
Wendet Stile auf alle Elemente eines bestimmten Typs an.
p {
/* styles */
}
Klassenselektor
Wendet Stile auf Elemente mit einem bestimmten Klassenattribut an.
.highlight {
/* styles */
}
ID-Selektor
Zielt auf ein bestimmtes Element mit einem eindeutigen ID-Attribut ab.
#header {
/* styles */
}
CSS-Eigenschaften
CSS-Eigenschaften definieren, wie die ausgewählten Elemente gestaltet werden sollen. Hier sind einige gängige CSS-Eigenschaften:
colorlegt die Textfarbe fest;background-colorlegt die Hintergrundfarbe eines Elements fest;font-sizelegt die Textgröße fest;marginfügt den Abstand um ein Element hinzu.
Das Erscheinungsbild der Webseite kann durch das Anwenden von CSS-Stilen auf die HTML-Elemente angepasst werden, um ansprechende und benutzerfreundliche Erlebnisse zu schaffen.
Beispiel:
index.html
index.css
Videoanleitung
Danke für Ihr Feedback!
Fragen Sie AI
Fragen Sie AI
Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen
Großartig!
Completion Rate verbessert auf 5
Einführung in CSS zur Gestaltung von Webseiten
Swipe um das Menü anzuzeigen
CSS (Cascading Style Sheets) verleiht Ihren Webseiten das visuelle Erscheinungsbild. Während HTML die Struktur bereitstellt, steuert CSS Farben, Schriftarten, Abstände und Layout – ähnlich wie Dekoration und Inneneinrichtung das Aussehen eines Hauses bestimmen.
Hinzufügen von CSS zur Gestaltung von HTML
CSS kann auf drei Hauptarten angewendet werden.
Inline-Stile
Verwendung des style-Attributs zur schnellen Gestaltung eines einzelnen Elements.
index.html
Interne Stile
Einfügen eines <style>-Blocks im <head>, um Elemente auf derselben Seite zu gestalten.
index.html
Externe Stylesheets
Für größere Projekte sollte das CSS in einer separaten Datei gespeichert und mit dem HTML verknüpft werden.
Bitte die Dateien index.html und index.css im Beispiel überprüfen.
index.html
index.css
CSS-Selektoren
Selektoren legen fest, welche Elemente bestimmte Stile erhalten.
Elementselektor
Wendet Stile auf alle Elemente eines bestimmten Typs an.
p {
/* styles */
}
Klassenselektor
Wendet Stile auf Elemente mit einem bestimmten Klassenattribut an.
.highlight {
/* styles */
}
ID-Selektor
Zielt auf ein bestimmtes Element mit einem eindeutigen ID-Attribut ab.
#header {
/* styles */
}
CSS-Eigenschaften
CSS-Eigenschaften definieren, wie die ausgewählten Elemente gestaltet werden sollen. Hier sind einige gängige CSS-Eigenschaften:
colorlegt die Textfarbe fest;background-colorlegt die Hintergrundfarbe eines Elements fest;font-sizelegt die Textgröße fest;marginfügt den Abstand um ein Element hinzu.
Das Erscheinungsbild der Webseite kann durch das Anwenden von CSS-Stilen auf die HTML-Elemente angepasst werden, um ansprechende und benutzerfreundliche Erlebnisse zu schaffen.
Beispiel:
index.html
index.css
Videoanleitung
Danke für Ihr Feedback!