Ist natürlich kein Problem. Werde auch versuchen mich so einfach wie möglich auszudrücken so das eigentlich jeder seine eigene CSS erstellen kann.
Öffnet man die Datei die ich zum Download bereitgestellt habe so sieht man zuerst viele Zeilen. Einige beginnen mit einem Punkt (.ClassName) und andere mit einem Hashtag (#IdName).
Bei den Ids und Klassen handelt es sich um Kennungen die sich auf ein Elemente auf der Seite beziehen. Bei den Ids handelt es sich in der Regel um ein einzigartiges Element das nur einmal auf einer Seite vorhanden ist. Wie z.B. der Header oder das Imageboard. Die Classen beziehen sich ebenso auf Elemente auf der Seite können aber öfter genutzt werden. Z.B. haben ja alle Boxen auf Weblings einen grauen Rahmen und geht man mit der Maus drüber so wird der Rahmen blau. Das kommt durch die Klasse ".box-settings" und ".box-settings:hover". Hover steht hier für: Wenn man mit der Maus drüber geht.
Also es gibt zu jeder Zeile bzw. zu jedem Klassen- und ID-Namen ein entsprechendes Element auf der Weblings Website.
Hinter den Klassen- und ID-Namen findet ihr in den geschweiften Klammern {...} die Anweisungen wie sich das Element auf das sich bezogen wird zu verhalten hat. Um beim Beispiel des Klasse ".box-settings" zu bleiben schauen wir was dort in der Klammer steht. Hier steht "border: solid 1px #410143;" dieser Befehl gibt vor wie der Rand des Elements auszusehen hat das diesen Klassen-Namen trägt.
border = Rahmen/Rand
solid = durchgehende Linie. Möglich wäre auch dotted also gepunktet etc.
1px = die Breite des Rahmens
#410143 = die Farbe die der Rahmen haben soll
; = Ende einer einzelnen Anweisung
Mit :hover kann man nun Werte Überschreiben oder hinzufügen welche erst dann aktiv werden wenn man mit der Maus über entsprechende Element geht. Hier findet ihr eine Liste an CSS Anweisungen und ihre Beschreibung. Zu beachten ist nur das nicht jede Anweisung auf jedem Element wirksam ist. Entweder werden Anweisungen durch andere Blockiert oder die Anweisung hat keine Auswirkung.
Um jetzt zu wissen was man tut und ändert kann man sich ein praktisches Tool zu Hand nehmen welches im Firefox und Chrome schon standartmäßig dabei ist. Man kann auf jeder Seite mit der Maus auf das Element zeigen das man ändern möchte z.B. auf eine der Boxen unter "Neu im Forum". Es öffnet sich je nach Einstellung ein neues Fenster oder ein Fenster im aktuellen Tab. In dem Fenster könnt ihr nun sehen welche Klasse dieses Element hat.
Nun könnt ihr nach der Klasse in der CSS Datei suchen und diese dort bearbeiten. Solltet ihr den Namen nicht finden so könnt ihr ihn einfach dazuschreiben. So könnt ihr quasi den Großteil der Seite so aussehen lassen wie ihr wollt.
Wenn man sich ein wenig damit auseinander gesetzt hat dann kann man auch z.B. die "Neu im Forum" Boxen ausblenden und dafür den Linken Inhalt der Seite auf der vollen Breite anzeigen. Im Grunde sind durch das bearbeiten der CSS keine grenzen gesetzt wie die Seite aussehen kann.
Ladet ihr eure Fertige CSS hoch so könnt ihr den von euch erstellten Style dauerhaft nutzten und ggf. anderen Usern bereitstellen.
Hoffe die Erklärung ist gut verständlich. Falls es noch allgemein Fragen gibt dürft ihr dieser gerne hier stellen ansonsten bietet sich bei speziellen Fragen an einen eignen Topic zu erstellen wenn es zu eurer Frage noch keinen gibt. So können euch auch eher andere User aus der Community helfen.
