Do it yourself: CSS für Profil und Blog

@magiroth
ich möchte speziell die Links für die navigation und freundessleiste gefärbt bekommen, bisher hat das nur mit den Links funktioniert.

@magiroth
Also mit den Link für die Beiträge wieviele ich schon wi geschrieben habe usw. guck selbst ;)

Ah nun verstehe ich... Also dann liste ich gleich mal ein paar wichtige Linkgruppen auf:

Die drei Links oben rechts mit "Mein Profil", "Einstellungen"...:

.user_function a

Der Header:
...dazu die Rubriken wie "Echtzeit", "Schlüsselwörter" etc.:

?#header a

bzw.

.topnav a

...die Tabs mit den Themenbereichen:

Zerox schrieb:.tabnav a

......dazu der 'weiteres'-Link:

.a_more a

......und das Menu, das darüber geöffnet wird:

?#more_menu a

Die Liste mit den letzten Besuchern:

.user_view a

Der Footer mit der Linkleiste mit "Impressum", "Regeln"...:

.footer a

Die Freundesliste:
...der eigene Name zuoberst bei der Liste (ist kein echter Link):

div#mstatus_content

...alle User, die offline sind:

.mcell_inhalt a.at

...alle User, die online sind und Systemlinks:

.mcell_inhalt a.at_in

...fett geschriebene Links:

.mcell_inhalt a.at_bold

Die weiteren Kästchen unterhalb der Freundesliste:
...der Titel:

div.mcell2, div.mcell3

...der Inhalt:

div.mcell_inhalt2, div.mcell_inhalt3

So ich hoffe, ich habe alles wichtige erwischt...

@magiroth

ich verstehe noch nicht so ganz, wie ich die einfügen soll?? Und wie mache ich dannn Farbe damit? fehlt da nicht noch irgendein Code? Kannst du mir vllt. ein besipiel geben oder so?

@Zerox
Ja, da fehlt noch Code. Das ist nur die Beschreibung, welche Elemente angepasst werden sollen. Also sozusagen die Adresse des Links, den du anpassen willst. Da fehlt noch die Beschreibung, wie er dann aussehen soll.

Du willst jetzt z.B. die Linkfarbe der offline User ändern, da suchst du oben nach der Adresse, da steht...

magiroth schrieb:.mcell_inhalt a.at

...und hängst noch die Beschreibung (die Farbe) an, das sieht dann so aus:

.mcell_inhalt a.at {
color: &zwj#FFFF00;
}

Ausser color kann man da auch noch ganz andere Beschreibungen zwischen den Klammern einfügen.

Jetzt hast du die Farbe, wie der link normal aussieht. Wenn du mit der Maus darüber fährst, willst du ihn aber vll in einer anderen Farbe. Dazu muss man das ganze von oben kopieren und noch ein ":hover" anhängen:

.mcell_inhalt a.at:hover {
color: &zwj#FF0000;
}

Dein Code für offline User sieht dann also so aus:

.mcell_inhalt a.at {
color: &zwj#FFFF00;
}
.mcell_inhalt a.at:hover {
color: &zwj#FF0000;
}

Das ganze wird dann einfach in den style-Tag eingefügt, denn du ja eh schon hast für die andren Links.

@magiroth
Okay danke aber noch eine letzte Frage:
das muss in die <Style> schiene rein, oder?

@magiroth
Hover anhängen?

@magiroth

<style>
body {color: #73256;}
a {color: #8F14E0;}
a:hover {color: #BF1BE0;}

.header {background: none; background-color: transparent;}
.tabnav a, .tabnav a:hover {background-color: transparent;}
.mcell, .mcell_status, .mcell2, .mcell_inhalt, .mcell_inhalt2 {background-color: transparent;}



.mcell_inhalt a.at {
color: &zwj#73256;
}
.mcell_inhalt a.at:hover {
color: &zwj#BF1BE0;
}

</style>

das ist jetzt der ganze Code den ich zusammen habe, ist dass dann so Richtig?

body {color: #73256;}
a {color: #8F14E0;}
a:hover {color: #BF1BE0;}

.header {background: none; background-color: transparent;}
.tabnav a, .tabnav a:hover {background-color: transparent;}
.mcell, .mcell_status, .mcell2, .mcell_inhalt, .mcell_inhalt2 {background-color: transparent;}



.mcell_inhalt a.at {
color: &zwj#73256;
}
.mcell_inhalt a.at:hover {
color: &zwj#BF1BE0;
}

<style>
body {color: #73256;}
a {color: #8F14E0;}
a:hover {color: #BF1BE0;}

.header {background: none; background-color: transparent;}
.tabnav a, .tabnav a:hover {background-color: transparent;}
.mcell, .mcell_status, .mcell2, .mcell_inhalt, .mcell_inhalt2 {background-color: transparent;}

.user_function a {color: #73256;}
.user_function a.at:hover {color: #BF1BE0;}

.topnav a.at {color: #73256;}
.topnav a a.at:hover {color: #BF1BE0;}

.user_view a.at {color: #73256;}
.user_view a.at:hover {color: #BF1BE0;}

.footer a.at {color: #73256;}
.footer a.at:hover {color: #BF1BE0;}

.mcell_inhalt a.at {color: #73256;}
.mcell_inhalt a.at:hover {color: #BF1BE0;}

.mcell_inhalt a.at_in {color: #73256;}
.mcell_inhalt a.at_in:hover {color: #73256;}

div.mcell2, div.mcell3 {color: #73256;}
div.mcell2, div.mcell3:hover {color: #73256;}

div.mcell_inhalt2, div.mcell_inhalt3 {color: #73256;}
div.mcell_inhalt2, div.mcell_inhalt3 {color: #73256;}



Das ist jetzt der komplette Code den ich erstellt habe, aber der will nicht, wie ich will, was habe ich falsch gemacht??

@magiroth

@Zerox

Da haben sich von meiner Seite her leider einige Fehler eingeschlichen... Schade kann man das später nicht mehr bearbeiten.

Ok also hier die Änderungen zu dem, was du aktuell im Profil hast.
Deine Zeile
.header a. {color: #5822A8;}
hat nen . zuviel, das sollte so aussehen:
.header a {color: #5822A8;}

Dann habe ich fälschlicherweise .more_menu geschrieben, was aber eig #moreMenu heissen sollte. Das musst du auf zwei Zeilen noch ersetzen.

Im footer gibt es kein .at, das ist nur rechts in der Fl so. Das sollte demnach so heissen:
.footer a {color: #5F1769;}
.footer a:hover {color: #BF1BE0;}

.at und .at_in habe ich vertauscht, .at steht für online und .at_in für offline. Aber das hast du wohl schon selbst gemerkt.
Bei deinem .at_in und .at_bold gibt es ausserdem ein Problem mit dem hover. Und zwar ist da der Farbcode den du zugewiesen hast zu kurz, nur fünf statt sechs Zeichen.
Wie ich gerade sehe, hast du das auch an anderen Orten. Also den Farbcode #73256 mit dem ersetzen, den du eigentlich dafür wolltest.

Damit sollte dann eigentlich alles funktionieren.

@magiroth

Ich habe das Problem vor exakt einer Minute selber lösen können, vielen Dank aber für deine Hilfe, hast was gut bei mir :bier:
Würde mich sehr über einen Besuch deinerseits freuen. Lieben Gruß

@Zerox
Noch nicht ganz ;)
Das mit dem . hast du sicher gefunden, aber hat noch ein paar andere Dinge. Geh das oben nochmals durch ^^

Btw. für etwas bin ich ja in dem Forum ^^

@magiroth

body {color: #73256;}
a {color: #4C0F73;}
a:hover {color: #BF1BE0;}

.header {background: none; background-color: transparent;}
.tabnav a, .tabnav a:hover {background-color: transparent;}
.mcell, .mcell_status, .mcell2, .mcell_inhalt, .mcell_inhalt2 {background-color: transparent;}

.user_function a {color: #5822A8;}
.user_function a.at:hover {color: #BF1BE0;}

.header a. {color: #5822A8;}
.header a:hover {color: #BF1BE0;}

.tabnav a {color: #4C0F73;}
.tabnav a:hover {color: #BF1BE0;}

.a_more a {color: #5822A8;}
.a_more a:hover {color: #BF1BE0;}

.more_menu a {color: #5822A8;}
.more_menu a:hover {color: #BF1BE0;}

.user_view a.at {color: #4C0F73;}
.user_view a.at:hover {color: #BF1BE0;}

.footer a.at {color: #5F1769;}
.footer a.at:hover {color: #BF1BE0;}

.mcell_inhalt a.at {color: #5F1769;}
.mcell_inhalt a.at:hover {color: #BF1BE0;}

.mcell_inhalt a.at_in {color: #4C0F73;}
.mcell_inhalt a.at_in:hover {color: #73256;}

.mcell_inhalt a.at_bold {color: #5822A8;}
.mcell_inhalt a.at_bold:hover {color: #73256;}

div.mcell2, div.mcell3 {color: #5822A8;}
div.mcell2, div.mcell3:hover {color: #73256;}

div.mcell_inhalt2, div.mcell_inhalt3 {color: #5822A8;}
div.mcell_inhalt2, div.mcell_inhalt3:hover {color: #73256;}

ich hab das 2x durchgeguckt mindestens, jetzt ist doch alles friedlich? Also mein profil ist zumindest endlich ordentlich ;)

Hallo,

Ich habe da mal eine Frage:

Wie kann man den Cursor im Profil ändern?
Ich finde diesen weißen Pfeil nämlich ziemlich langweilig.

@chipsdose
Beitrag von maybee (Seite 6)

@chipsdose
nimm diesen code

<*style>*{cursor:move}<*/style>

und bei move setzt du das ein

crosshair---> Fadenkreuz
hand---> Handsymbol [IE|O]
wait ---->Sanduhr
help---> Fragezeichen
e-resize --->Pfeil - rechts
w-resize---> Pfeil - links
n-resize---> Pfeil - oben
nw-resize---> Pfeil - links oben
ne-resize---> Pfeil - rechts oben
text---> Gerader Strich
move---> Kreuz mit Pfeilen
pointer---> Wie Attribut Hand
default --->Standard
progress --->Zeiger u. Sanduhr
not-allowed---> Nicht Erlaubt!

und streich die sternchen weg

ups natürlich..sorry :)

@rutz
das funktioniert irgendwie nicht.
Ich habe übrigens das Format auf HTML, liegt das daran?