Mein Sohn bastelt zur Zeit an seiner ersten Webseite und fragte mich heute Morgen, warum seine Seite im Firefox nach link gerutscht sei und im Internet-Explorer nicht?
Der Grund war schnell gefunden, im css fehlte ein {margin: 0 auto 0 auto;}
Anlass genug , dass wir uns darüber unterhielten was denn eigentlich eine .css Datei so tut und wozu die da ist.
Eine html- Webseite ist wie eine Party, zu der man ganz viele Personen (Elemente) einladen kann. Diese Elemente haben einen Namen, so wie auch Personen einen Namen haben. Wer das alles ist und wie die Namen der Personen sind, kann man erfahren, wenn man einen Blick in den Code der html-Seite wirft. Die Namen stehen in spitzen Klammern.
Wenn du mal einen Blick in folgende Tabelle wirfst, kannst du sehen, wen man alles zu so einer Party einladen kann.
Personen haben aber nicht nur einen Namen, sondern auch ein individuelles Aussehen. Und das ist das Gute an Webseiten: mit CSS kann man nämlich selber bestimmen, wie die Gäste aussehen sollen und nicht nur das. CSS ist nämlich echt was für Kontrollfreaks, denn man bestimmt damit auch wo die Gäste stehen, wie dick sie sind oder wie dünn, ob sie rot oder grün sein sollen oder sich gar unsichtbar machen, ob sie sich über andere hinweg setzen oder sich in eine Polonaise einreihen, ob sie zu einer Gruppe gehören oder ob sie Individualisten sind und noch vieles mehr.
Ich mache aus meiner Webseite also einen Party-Keller. Diesen Raum verknüpfe ich mit einer Beschreibung, die alle Informationen darüber enthält, wie der Raum und die Gäste darin aussehen sollen.
Wenn ich nun eine fertige Webseite habe, die CSS-Stylesheets benutzt und ich am Aussehen der Gäste etwas verändern möchte, dann gehe ich den umgekehrten Weg und schaue ich mir zuerst den Partyraum an. Dort kann ich sehen wer alles zu der Party gekommen ist.
Zu Deutsch: Ich schalte im Browser die Codeansicht ein und suche die Stelle, an der ich etwas verändern möchte.
Dort kann ich sehen wie die Person heißt, die ich verändern möchte.
Zu Deutsch: ich suche den Namen des html-Tags. Dann öffne ich die .css Datei und suche dort den Namen des Elementes.
Habe ich diesen gefunden, kann ich diesem Element recht einfach z.B. eine andere Hintergrundfarbe geben oder ihm eine andere Position zuweisen.
Eine sehr schöne Erklärung.
Diese Referenzliste der Elemente ist auch nicht schlecht. Da erkenne ich immer wieder, dass es Elemente gibt, die ich noch nicht kenne!
Hallo Markus,
da in den meisten anderen Blogs die Dinge hinsichtlich CSS und dem ganzen Drum und Dran schon hinreichend gut bis sehr gut, aber leider in Fachchinesisch erklärt sind, dachte ich mir, dass ich mal Anleitungen und Erklärungen schreibe, die wirklich für blutige Anfänger geeignet sind und die jeder Laie verstehen kann.
Es wird daher noch Forsetzungen geben, die alle die Newbie-Biene als Erkennungszeichen tragen. Über Fragen und Anregungene was ich denn mal erklären könnte und was nicht verstanden wird, wäre ich dankbar.
Der nächste Artikel, der erscheinen wird, ist schon in Vorbereitung. Dabei geht es um das Thema Positionierung von CSS-Elementen.
Liebe Grüße
Jutta