CSS

CSS ist die Abkürzung für Cascading Style Sheets. In Freewar wird die Sprache CSS zum Erstellen von Styles benötigt.

Eine einweisende Erkläuterung für CSS schrieb Lady Biene und ist auch in Lady Bienes Forum zu finden.

Eine wikifizierte Form des Artikels finden Sie auch hier:

Erläuterungen zu CSS

Bevor wir Euch die einzelnen Bereiche näher erläutern zuerst einige grundlegende Worte zu CSS.

Die ganze Datei ist in verschiedene Bereiche aufgeteilt, wie ihr zum Beispiel hier den Bereich über die verschiedenen Hintergrundfarben seht:

/* bgcolors */
.body { background-color: #FFFFFF; }
.divider { background-color: #555555; }
.outline { background-color: #999999; }
.menubg  { background-color: #F1F1F1; }

Es steht immer erst ein beschreibender Teil dort, welcher sagt, was da bestimmt wird. In den { } Klammern stehen die Eigenschaften des entsprechenden Bereiches. Eigenschaften können Farben, Hintergrund oder die Höhe eines Frames (Fenster) sein. Alle Eigenschaften müssen durch ein Semikolon ( ; ) getrennt werden. Achtet darauf, dass ihr die EIgenschaften richtig schreibt, da sie sonst nicht erkannt wird. Es wird nur stur gelesen, was der Browser machen soll und wenn es falsch geschrieben ist, dann liest er das so, als ob da garnichts stünde.

Selektor {Eigenschaft : Wert}

Und was gibt es da nun für Eigenschaften?

Folgende Eigenschaften können verwendet werden:

• color: #FFFF00 -> die Farbe, die eine Schrift haben soll (ACHTUNG!: Das "#" darf nicht vor dem Zahlen-Code vergessen werden!)
• background-color: #0000FF -> die Hintergrundfarbe (ACHTUNG!: Das "#" darf nicht vor dem Zahlen-Code vergessen werden!)
• background-image: url(www.domain.de/meinwunschbild.jpg) ->fügt ein Bild als Hintergrund ein. Kann auch mit "background-color" verwendet werden, wenn das Bild nicht alles ausfüllt (ACHTUNG!: Bei der Url die Klammern nicht vergessen!)

Kann man Bilder auch im Frame verschieben bzw. ausrichten?

Ja, das ist möglich. Es gibt verschiedene Formatierungsmöglichkeiten:

• background-repeat: no-repeat lässt das Bild nicht wiederholen
• background-repeat: y-repeat wiederholt sich auf der y-achse -> also nach oben/unten
• background-repeat: x repeat wiederholt sich auf der x-achse -> also nach rechts/links [ist nötig für kleine Bilder, die nicht den ganzen Frame ausfüllen sollen, z.B. kleine Figuren]
• background-position: jetzt kann man verschiedene sachen eingeben zB. top(oben), bottom(unten), right(rechts), left(links) oder center(mittig). ->Dies ist dazu da, um ein Bild zu positionieren, z.B. um es rechts oben hinzusetzten gibt man "background-position: top right" ein.
• "background-color: transparent" -> damit kann man den Hintergrund transparent machen, man kann also hindurch sehen [wenn nichts weiter festgelegr ist, bleibt der Hintergrund schwarz. ist z.B. wichtig, wenn man den Teil, wo die Überschrift der Feldbeschreibung ist, das Hintergrundbild dort auch noch sehen will.]
• background-attachment : fixed -> ist dazu da, um das Hintergrundbild zu fixieren, nur nötig beim chattext