Wie bindet man CSS-Code ein?
Ansicht 0…
CSS-Code extern in Visual-Studio-Code auslagern und anzeigen.
Praktisches Beispiel: Du möchtest eine kleine Webseite coden. Du kannst dies mit HTML, CSS, Java-Script machen.
Das HTML ( Markup-Sprache) bildet die Grundstruktur und mit CSS, das ist eine Stylesheetsprache bestimmst du, wo sollen die Bilder hin, wie soll der Hintergrund aussehen, praktisch alles was sich im Style-Bereich befindet.
Abbildung 1.0
Das Problem, wenn du das so machst, dann wird dir dein CSS nicht angezeigt. Warum eigentlich nicht?
Antwort du musst das HTML mit dem CSS mit HIlfe einer sogenannten Verknüpfungszeile verbinden.
Abbildung 2.0 – Mein CSS wird mir nicht angezeigt. Was ist da los?
Abbildung 2.0
In unserem Beispiel wurde in der Verknüpfungszeile das ganze mit „style.css“ gemacht. Es ist auch möglich, wenn du das File „styles.css“ nennst, allerdings musst du das dann auch in der Verknüpfungszeile (link rel ….. styles.css) nennen, sonst funktioniert es nicht. Das File auf der linken Seite und die Verknüpfung müssen die selben Namen haben.
Abbildung 3.0
Manche binden das CSS so ein…
Schritt 3…. Um das ganze dann anzuschauen, brauchst du den Live-Server. Den musst du dir natürlich installieren. Wie funktionier Visual-Studio-Code eigentlich? Übersicht
Hier ist nochmals alles in einem Video zusammengefasst für dich.
Video ( CSS-Code extern auslagern) ( 9: 45 min)
zurück zum Cyberspace 2 / Anfänger