Suche im Forum:
Suchen


Autor Nachricht
Beitrag12.10.2013 um 13:03 (UTC)    
Titel: Bei Mouseover Text unterstrichen

Hallo,

ich bin leider in mit html und CSS nicht so bewandert und finde auch keine Lösung für mein Problem. Vielleicht kann mir jemand helfen.
Ich habe auf meiner HP eine Tabelle, in der Links enthalten sind. Die Hintergrundfarbe ändert sich wenn ich mit dem Mauszeiger darüber fahre. Soweit alles in Ordnung. Ich hätte aber gerne, dass sich zusätzlich der Text beim Darüberfahren unterstreicht und nur bei Anklicken des Link die Mouseoverfarbe dann bleibt, so dass ich, wenn ich dann einen 2. oder 3. Link anklicke immer sehen kann, was ich schon alles angeklickt habe. Für eine Hilfe schon mal vielen Dank.
Hier die Adresse meiner Seite: http://triumphkegelklub.de.tl/Ergebnisse-2013.htm
Und hier der Quellcode:
<font size="4">
<p style="text-align: center">&nbsp;</p>
<table border="3" cellspacing="1" cellpadding="1" width="70%" align="center">
<tbody>
<tr>
<td bgcolor="#ff0000" height="40" valign="middle" width="50%" align="center" style="text-align: center"><span style="font-family: Arial"><span style="font-size: large"><span style="color: rgb(255,255,0)">&nbsp;</span><strong><span style="font-size: x-large"><span style="color: rgb(255,255,0)"> Alle Ergebnisse 2013</span></span></strong></span></span></td>
</tr>
</tbody>
</table>
<br />
<div style="text-align: center">&nbsp;</div>
<table border="1" cellspacing="1" cellpadding="1" width="70%" align="center">
<tbody>
<tr>
<td bgcolor="#ff0000" height="30" width="70%" style="text-align: center"><span style="font-size: large"><strong><span style="font-family: Arial"><span style="color: rgb(255,255,0)">Interne Meisterschaften</span></span></strong></span></td>
<td bgcolor="#ff0000" width="30" style="text-align: center"><span style="font-size: large"><strong><span style="font-family: Arial"><span style="color: rgb(255,255,0)">Update</span></span></strong></span></td>
</tr>
<tr>
<td bgcolor="#ffffcc" height="30" valign="middle" align="center" onmouseout="style.backgroundColor='#ffffcc'" onmouseover="style.backgroundColor='#C1FFC1'" style="text-align: center"><span style="font-size: medium"><span style="color: rgb(0,0,255)"><strong><a target="_blank" href="http://www.hostarea.de/server-09/September-feb38b4e69.pdf"><span style="font-size: medium"><span style="font-family: Arial"><span style="color: rgb(0,0,255)">Klubmeisterschaft</span></span></span></a></strong></span></span></td>
<td bgcolor="#ffffcc" style="text-align: center"><span style="font-size: medium"><strong style="font-family: Arial">26.09.2013</strong></span>&nbsp;</td>
</tr>
<tr>
<td bgcolor="#ffffcc" height="30" width="70%" onmouseout="style.backgroundColor='#ffffcc'" onmouseover="style.backgroundColor='#C1FFC1'" style="text-align: center"><span style="font-size: medium"><span style="color: rgb(0,0,255)"><strong><a target="_blank" href="http://www.hostarea.de/server-09/September-29d3a10ee4.pdf"><span style="font-size: medium"><span style="font-family: Arial"><span style="color: rgb(0,0,255)">Gesamtschnitt</span></span></span></a></strong></span></span></td>
<td bgcolor="#ffffcc" width="30%" style="text-align: center"><span style="font-size: medium"><strong style="font-family: Arial">26.09.2013</strong></span>&nbsp;</td>
</tr>
<tr>
<td bgcolor="#ffffcc" height="30" onmouseout="style.backgroundColor='#ffffcc'" onmouseover="style.backgroundColor='#C1FFC1'" style="text-align: center"><span style="font-size: medium"><span style="color: rgb(0,0,255)"><strong><span style="font-size: medium"><span style="font-family: Arial"><span style="color: rgb(0,0,255)">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<a target="_blank" href="http://www.hostarea.de/server-07/Juli-3f60725dd4.pdf"><span style="color: rgb(0, 0, 255);"><span style="font-size: medium;">KO - Pokal</span></span></a><span style="color: rgb(0, 0, 255);"><span style="font-size: medium;">&nbsp;</span></span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; beendet</span></span></span></strong></span></span></td>
<td bgcolor="#ffffcc" valign="middle" align="center" style="text-align: center"><span style="font-size: medium"><strong style="font-family: Arial">19.07.2013</strong></span>&nbsp;</td>
</tr>
<tr>
<td bgcolor="#ffffcc" height="30" onmouseout="style.backgroundColor='#ffffcc'" onmouseover="style.backgroundColor='#C1FFC1'" style="text-align: center"><span style="font-size: medium"><span style="color: rgb(0,0,255)"><strong><a target="_blank" href="http://www.hostarea.de/server-01/Januar-9df9686c74.pdf"><span style="font-size: medium"><span style="font-family: Arial"><span style="color: rgb(0,0,255)">Vereinspokal</span></span></span></a></strong></span></span></td>
<td bgcolor="#ffffcc" style="text-align: center"><span style="font-size: medium;"><strong style="font-family: Arial;">16.11.2013</strong></span>&nbsp;</td>
</tr>
<tr>
<td bgcolor="#ffffcc" height="30" valign="middle" align="center" onmouseout="style.backgroundColor='#ffffcc'" onmouseover="style.backgroundColor='#C1FFC1'" style="text-align: center"><span style="font-size: medium"><span style="color: rgb(0,0,255)"><strong><a target="_blank" href="http://www.hostarea.de/server-01/Januar-60add5c77b.pdf"><span style="font-size: medium"><span style="font-family: Arial"><span style="color: rgb(0,0,255)">K&auml;mpfe</span></span></span></a></strong></span></span></td>
<td bgcolor="#ffffcc" style="text-align: center"><span style="font-size: medium"><strong style="font-family: Arial">03.01.2013</strong></span></td>
Beitrag12.10.2013 um 13:58 (UTC)    
Titel:

HeyHo,

schau mal hier:

Code:
/* Linkfarben + Größen auf Seiten */
a:link {
color:#800000;
font-size:13px;
font-family:arial, Times New Roman, Helvetica, Verdana, Comic Sans MS
, Courier New, Tahoma;
text-decoration:none; }

/*Hover-Effekt bei Links*/
a:hover{
color:#800000;
font-size:13px;
font-family:arial, Times New Roman, Helvetica, Verdana, Comic Sans MS
, Courier New, Tahoma;
text-decoration:none;}

/* besuchte Links */
a:visited {
color:#800000;
font-size:13px;
font-family:arial, Times New Roman, Helvetica, Verdana, Comic Sans MS
, Courier New, Tahoma;
text-decoration:none;} 
-->


Das solltest du, wenn mich nicht alles täuscht, bei Text über dem Design finden.

a:link = alles was den Link betrifft
a:hover = alles was passiert, wenn du mit dem Mauszeiger darüber fährst
a:visited = alles was einen bereits besuchten Link betrifft

d.h. du änderst bei folgendes:
bei a:hover
text-decoration:none; zu text-decoration:underline;
color:#800000; zu bspw: color:#9D3AE4;
und schon wird der Link beim "überfahren" andersfarbig angezeigt und unterstrichen.
Bei a:visited trägst du
color:#800000; zu bspw: color:#9D3AE4; ein und schon siehts du, welchen Link du bereits besucht hast, da er die Farbe des Mouseover Effektes angemommen hat.
______________
mfg SEO
Beitrag12.10.2013 um 18:53 (UTC)    
Titel:

Hallo seo-suchmaschinenoptimierung,

zunächst vielen Dank für die Annahme zu meinem Problem. Ich hoffe, du hast Geduld mit mir. Wie schon erwähnt bin ich in solchen Sachen nicht ganz firm.
Also ich habe den von dir gezeigten Code bei " Text über dem Design" gefunden.
Nun habe ich versucht das darin so zu ändern wie du es beschrieben hast. Siehe:
/* Linkfarben + Größen auf Seiten */
a:link {
color:#800000;
font-size:13px;
font-family:arial, Times New Roman, Helvetica, Verdana, Comic Sans MS
, Courier New, Tahoma;
text-decoration:none; }

/*Hover-Effekt bei Links*/
a:hover{
color:#9D3AE4;
font-size:13px;
font-family:arial, Times New Roman, Helvetica, Verdana, Comic Sans MS
, Courier New, Tahoma;
text-decoration:underline;}

/* besuchte Links */
a:visited {
color:#C1FFC1;
font-size:13px;
font-family:arial, Times New Roman, Helvetica, Verdana, Comic Sans MS
, Courier New, Tahoma;
text-decoration:none;}
-->
</style>

Ich weiß nicht ob ich alles richtig gemacht habe. Das mit dem Unterstreichen funktioniert, aber dass der besuchte Link danach seine Mouseover-Farbe behält funktioniert nicht. Muss ich irgendetwas am Quelltext der Seite mit den Links machen oder habe ich oben etwas verkehrt gemacht?
Beitrag13.10.2013 um 19:58 (UTC)    
Titel:

Kann es sein, dass du der Schrift innerhalb der Tabelle eine Farbe gegeben hast? Das sagt mir zumindest der Quelltext ...
Code:
<span style="font-size: medium">
<span style="color: rgb(0,0,255)">Stadtmeisterschaft Lauf</span>
</span>

Also, die Schrift im Editor ausgewählt und eine Farbe vergeben und ich gehe mal davon aus, dass es sich dabei um Blau handelt. Wink
Damit wird der Code, den du im Text über dem Design eingetragen hast, nämlich wieder überschrieben.
Ist mir auch nur aufgefallen, weil die besuchten Links bei mir einen fast nicht sichtbaren Strich unter der Schrift anzeigen, wenn ich mit der Maus darüber fahre.
color:#C1FFC1; ist ein sehr helles Grau und auf weissem Hintergund kaum sichtbar.
______________
mfg SEO
Beitrag14.10.2013 um 11:33 (UTC)    
Titel:

Hallo seo-suchmaschinenoptimierung,

danke für deine Geduld mit mir. Ja ich habe die Schriftfarbe im Editor ausgewählt. Ich hab es zurückgenommen und die blaue Farbe im Code eingetragen. Das mit dem Unterstrich funktioniert ja super. Aber ich glaube, dass wir doch irgendwie aneinander vorbei sind. Vielleicht habe ich mich auch falsch ausgedrückt.. Ich wollte den Unterstrich (was ja funktioniert) und hätte gerne gehabt, dass die Hintergrundfarbe (nicht der Linktext), die ja beim Darüberfahren mit der Maus von gelb auf grün, bzw. von gelb auf rose wechselt, nach einem Linkbesuch grün bzw. rose bleibt. Erst wenn die HP-Seite wieder neu aufgerufen wird sollte der Hintergrund in Grundstellung gelb sein. Warum ist color:#C1FFC1 bei dir ein sehr helles Grau? Bei mir ist es die grüne Hintergrundfarbe wenn ich mit der Maus darüber fahre.
Beitrag03.11.2013 um 10:34 (UTC)    
Titel:

Hallo seo-suchmaschinenoptimierung,

nachdem ich alles nochmal überprüft habe, funktioniert es jetzt bei mir.
Vielen Dank nochmal.
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de