Seite 1 von 7

Text durch Bild ersetzen

Verfasst: 15. Jan 2010, 22:04
von Morphium
Hallo,
es kann ja sein dass es zu diesem Thema schon Fragen udn Antworten gibt, aber ich bin zu doof die zu finden.
Ich möchte zum Beispiel das CLAN-MITGLIED durch ein Bild ersetzen.
Wie kann ich das machen? Ich finde hier nur wie ich die Farben davon ändern, oder das Ganze komplett ausblenden kann.

Danke schonmal für die Hilfen


Morphium

Re: Text durch Bild ersetzen

Verfasst: 16. Jan 2010, 01:26
von Kauket
Ich tipp mal auf das.. jedenfalls teilweise und iwie.. hab ich ausm Kaspersky dings style raus kopiert:

Code: Alles auswählen

/* > > Symbole im Menu-Frame */
.framemenubg a[href*="reload=true"] { left: 8px; top: 3px; width: 23px; height: 31px; background: url(images/menu1.png) no-repeat 1px 2px; padding-left: 6px; border-right: 0px; -moz-border-radius-topleft: 6px; -moz-border-radius-bottomleft: 6px; -webkit-border-top-left-radius: 6px; -webkit-border-bottom-left-radius: 6px; }
.framemenubg a[href*="reload=true"]:hover:after { content: "Aktualisieren"; margin: 38px 0px 0px 88px; }
.framemenubg a[href*="statsmap.php"] { left: 38px; top: 3px; width: 29px; height: 31px; background: url(images/menu2.png) no-repeat 1px 2px; border-left: 0px; border-right: 0px; }
.framemenubg a[href*="statsmap.php"]:hover:after { content: "Karte"; margin: 38px 0px 0px 87px; }
.framemenubg a[href*="forum.freewar.de"] { left: 67px; top: 3px; width: 29px; height: 31px; background: url(images/menu3.png) no-repeat 1px 2px; border-left: 0px; border-right: 0px; }
.framemenubg a[href*="forum.freewar.de"]:hover:after { content: "Forum"; margin: 38px 0px 0px 56px; }
.framemenubg a[href*="profil.php"] { left: 96px; top: 3px; width: 29px; height: 31px; background: url(images/menu4.png) no-repeat 0px 2px; border-left: 0px; border-right: 0px; }
.framemenubg a[href*="profil.php"]:hover:after { content: "Einstellungen"; margin: 38px 0px 0px 7px; }
.framemenubg a[href*="action=archive"] { left: 125px; top: 3px; width: 30px; height: 31px; background: url(images/menu5.png) no-repeat 1px 2px; border-left: 0px; border-right: 0px; }
.framemenubg a[href*="action=archive"]:hover:after { content: "Archiv"; margin: 38px 0px 0px -2px; }
.framemenubg a[href*="friends.php"] { left: 155px; top: 3px; width: 29px; height: 31px; background: url(images/menu6.png) no-repeat 1px 2px; border-left: 0px; border-right: 0px; }
.framemenubg a[href*="friends.php"]:hover:after { content: "Freunde"; margin: 38px 0px 0px -37px; }
.framemenubg a[href*="stats.php"] { left: 184px; top: 3px; width: 29px; height: 31px; background: url(images/menu7.png) no-repeat 1px 2px; border-left: 0px; border-right: 0px; }
.framemenubg a[href*="stats.php"]:hover:after { content: "Statistik"; margin: 38px 0px 0px -66px; }
.framemenubg a[href*="support.php"] { left: 213px; top: 3px; width: 29px; height: 31px; background: url(images/menu8.png) no-repeat 1px 2px; border-left: 0px; border-right: 0px; }
.framemenubg a[href*="support.php"]:hover:after { content: "Support"; margin: 38px 0px 0px -95px; }
.framemenubg a[href*="logout.php"] { left: 242px; top: 3px; width: 29px; height: 31px; background: url(images/menu9.png) no-repeat 1px 2px; border-left: 0px; -moz-border-radius-topright: 6px; -moz-border-radius-bottomright: 6px; -webkit-border-top-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; }
.framemenubg a[href*="logout.php"]:hover:after { content: "Logout"; margin: 38px 0px 0px -121px; }
.framemenubg a[href*="admin.php"] { right: 8px; bottom: 5px; width: 23px; height: 17px; background: url(images/menu10.png) no-repeat 3px 1px; padding: 0px 3px 1px 0px; -moz-border-radius: 6px; -webkit-border-radius: 6px; opacity: 1.00; }
.framemenubg a[href*="admin.php"]:hover:after { content: "Admin"; margin: 1px 0px 0px -123px; }
.framemenubg a[href*="showallmsgs=1"] { position: static; display: block; border: 0px; color: #ECEAEA !important; width: 10px; margin: 42px 0px 0px -25px; background: transparent !important; opacity: 1.00; }
.framemenubg a[href*="showallmsgs=1"]:hover:after { content: "Neue Nachricht"; display: block; margin-left: 124px; }
.framemenubg a[href*="showallmsgs=1&zeromsg=1"] { position: absolute; left: 8px; bottom: 5px; color: #ECEAEA !important; width: 8px; height: 18px; background: url(images/menu11.png) no-repeat 3px 1px #F7F7F7 !important; margin-left: 0px; padding: 0px 2px 0px 25px; border: 1px solid #B0B0B0; -moz-border-radius: 6px; -webkit-border-radius: 6px; }
.framemenubg a[href*="showallmsgs=1&zeromsg=1"]:before { content: "0"; display: block; color: #2C6C98 !important; font-size: 11px; margin-bottom: 25px; padding: 3px 0px 0px 2px; line-height: 100%; }
.framemenubg a[href*="showallmsgs=1&zeromsg=1"]:hover:after { content: "Keine Nachricht"; margin: -38px 0px 0px 64px; }
.framemenubg blink { position: absolute; left: 8px; bottom: 5px; font-size: 11px; color: #D20000; height: 14px; background: url(images/menu12.png) no-repeat 3px 1px #F7F7F7; padding: 3px 2px 1px 25px; border: 1px solid #B0B0B0; line-height: 100%; text-decoration: blink; -moz-border-radius: 6px; -webkit-border-radius: 6px; }

Re: Text durch Bild ersetzen

Verfasst: 16. Jan 2010, 03:04
von Morphium
Nunja, das scheint schonmal ein guter Ansatz zu sein, allerdings sind alle hier aufgeführten Texte Links aus der Menüleiste, und das ich Menüs verändern kann war mri eig schon klar.
Aber ich will ja einen reinen Text verändern, oder ausblenden udn Bild rein, was auch immer.

Aber danke schonmal.

Re: Text durch Bild ersetzen

Verfasst: 16. Jan 2010, 09:06
von Po1son
ich glaub du meinst folgendes:

Code: Alles auswählen

p.listusersrow [color="#0055aa"] {font-size:0pt;}
p.listusersrow [color="#0055aa"]:before { content:  url(Bildlink);}

Re: Text durch Bild ersetzen

Verfasst: 16. Jan 2010, 14:07
von Morphium
Ich werd es mal austesten, und sag dir dann ob es funktioniert hat, danke.

Ja, das passt, danke dafür :).

Jetzt hat sich aber ne neue Frage aufgetan.
Wenn ich die Schrift da 0 setzte dann sind ja auch die Bindestriche zwischen den Gruppeneinladbild und der Flüsterblase weg.
Gibt es eine Möglichkeit dass diese trotzdem noch da bleiben? Oder kann ich die da anders wieder definieren?

Des Weiteren würde ich gerne wissen wie ich die Farbe der GRUPPEN-MITGLIED schrift ändern kann ohne dass es die schrift für den clan beeinflusst.


Danke

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 07:29
von Crazy_Ace
ähnliches funktioniert bei mir mit den links leider nicht, der ansatz ist an sich der gleiche. was funktioniert ist dieser:

Code: Alles auswählen

/* Spezialfähigkeit */
a[href="item.php?action=special"] { font-size: 0px; }
a[href="item.php?action=special"]:before { content: url(spezibalken.gif);}
was leider nicht geht ist der kram unten rechts (vllt muss man da was anderes ansprechen, ist doch prinzipiell das selbe, nicht?)?

Code: Alles auswählen

/* Nachrichten (0)*/
a[href="main.php?showallmsgs=1&zeromsg=1"] { font-size: 0px; }
a[href="main.php?showallmsgs=1&zeromsg=1"]:before { content: url(Nachrichten.jpg);}

/* Nachrichten (xx)*/
a[href="main.php?showallmsgs=1"] { font-size: 0px; }
a[href="main.php?showallmsgs=1"]:before { content: url(Nachrichten!.jpg);}


/* Aktualisieren */
a[href="menu.php?reload=true"] { font-size: 0px; }
a[href="menu.php?reload=true"]:before { content: url(reload.jpg);}

/* Karte */
a[href="statsmap.php"] { font-size: 0px; }
a[href="statsmap.php"]:before { content: url(Karte.jpg);}

/* Forum */
a[href="http://forum.freewar.de/index.php"] { font-size: 0px; }
a[href="http://forum.freewar.de/index.php"]:before { content: url(Forum.jpg);}

/* Profil */
a[href="profil.php"] { font-size: 0px; }
a[href="profil.php"]:before { content: url(profil.jpg);}

/* Bericht */
a[href="main.php?action=archive&mode=show"] { font-size: 0px; }
a[href="main.php?action=archive&mode=show"]:before { content: url(Archiv.jpg);}

/* Freunde */
a[href="friends.php"] { font-size: 0px; }
a[href="friends.php"]:before { content: url(Freunde.jpg);}

/* Reallife */
a[href="logout.php?holy_place=1"] { font-size: 0px; }
a[href="logout.php?holy_place=1"]:before { content: url(Logout.jpg);}

/* Support */
a[href="support.php"] { font-size: 0px; }
a[href="support.php"]:before { content: url(hilfe.jpg);}

/* Statistik */
a[href="stats.php"] { font-size: 0px; }
a[href="stats.php"]:before { content: url(Statistik.jpg);}
wäre um hilfe nicht ganz undankbar :?
wo ich mir nicht sicher bin, da es ja nicht geht, wovon ich jedoch ausgehe, ist, dass die "/" zwischen den einzelnen parzellen stehen bleiben. auch hier wäre ich um einen lösungsansatz froh *php- und html-noob ist*

danke schonmal im voraus :)

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 15:47
von Crend
Crazy_Ace hat geschrieben:
[...]

Code: Alles auswählen

[...]
/* Nachrichten (xx)*/
a[href="main.php?showallmsgs=1"] { font-size: 0px; }
a[href="main.php?showallmsgs=1"]:before { content: url(Nachrichten!.jpg);}
[...]
[...]
Woran das andere liegt, sehe ich auf Anhieb nicht. Aber da hast du eine Datei mit einem Ausrufezeichen im Dateinamen - das nimm mal ganz brav raus. *g*
Ansonsten kann ich dir nur raten (bei mir hat es immer funktioniert), den Dateinamen in Anführungszeichen zu setzen ... aber frag mich nicht, ob das daran liegt (konnte es auf die Schnelle nicht testen)... auch wenn es oben bei der Spezi-Fhgk ja ohne zu funktionieren scheint :?
Hast du sichergestellt, dass die Dateien bei dir im richtigen Verzeichnis liegen und richtig heißen?

(Falls ich iwas falsch verstanden habe, verzeih mir bitte. ;) )


Crend

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 16:38
von Crazy_Ace
das ausrufezeichen ist weg, danke für den tip(p?).

ansonsten okay... wenn du keinen fehler siehst vllt mal gucken, ob es am verzeichnis liegt... wie schauts mit den "/" aus?

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 17:22
von Crend
"Tipp". Wir sind deutsch.

Hm..
Das mit den Slashes würd ich so regeln, dass ich die Schriftgröße für den gesamten Menuframe auf 0px setze...
also

Code: Alles auswählen

body.framemenubg { font-size: 0px; } 
Dann sparst du dir das bei jedem Menu-Eintrag und kannst die dann für dich verändern ;)


Crend

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 17:32
von Crazy_Ace
hab keine ahnung, was ich falsch mache... irgendwie ändert sich grad gar nix mehr.

ich ändere, lade neu hoch, schau mir das hochgeladene sogar an, ob ers tatsächlich gemacht hat, was passiert ist: nichts.

hätte eigentlich erwartet, dass der von crend gegebene befehl funktioniert, was er rein technisch auch tun müsste. genauso wie der eigentlich identische "austauschbefehl" der urls...

hier mal der link zum ordner, vllt liegts an schlechter struktur oder an sonstwas, bin grad relativ verzweifelt in dem zusammenhang... wär echt schön, wenn wer auf den fehler käme.

http://dachbalken.da.funpic.de/Meins/Meins/

die css ist ja da auch einsehbar...

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 17:34
von Po1son
das dateiformat is richtig also jpg? und wie groß sind die bilder?

/edit hast den style vielleicht online damit man sich die css datei ansehen kann?/

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 17:36
von Crazy_Ace
alle um 1kb, 30x30 bzw 60x20 bzw 180x20.

obwohl ich denke, dass es dir auf die kbzahl ankam

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 17:44
von Po1son
also bei mir haut das hier so hin, hast meine pn bekommen? so wärs praktischer^^

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 18:07
von Crend

Code: Alles auswählen

p[title*=" 2%"]:after {content:" (02% Wenn du das siehst, dann ist etwas SEHR schief gelaufen)"; color:#ff0000; font-weight: bold;
Da liegt der Fehler.
Da fehlt das Ende der Zeite. *g* (also das } )

Daraufhin wird alles folgende nicht mehr erkannt ;)


Crend

Re: Text durch Bild ersetzen

Verfasst: 2. Mär 2010, 20:43
von kaot
Und der Pfad stimmt so auch nicht:

Code: Alles auswählen

http://dachbalken.da.funpic.de/Meins/Meins/Nachrichten2.jpg
statt

Code: Alles auswählen

http://dachbalken.da.funpic.de/Nachrichten2.jpg
alternativ: Nachrichten2.jpg solange es sich im selben Verzeichnis wie der Style selbst befindetet (bei dir momentan: /meins/Meins/)