hilfdirselbst.ch
Facebook Twitter gamper-media

"Geht nicht" ist keine gültige Fehlermeldung!

Moosbach
Beiträge: 382
17. Mär 2004, 14:55
Beitrag #1 von 4
Bewertung:
(559 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

unterschiedliche rollovereffekte mit css


da bin ich schon wieder.
ich möchte in verschiedenen textfeldern textlinks einsetzen und verwende dabei dieses css:
<style type="text/css" media="screen"><!--A:link { color: #B44605; text-decoration: none }
A:visited { color: #B44605; text-decoration: none }
A:hover { color: #7A2F07; text-decoration: underline }
A:active { color: #B44605; text-decoration: none }


--></style>

wie kann ich denn unterschiedliche rolloverfarben einsetzen bei unterschiedlichen textlinkblöcken?
wer hat ne idee? Top
 
X
Moosbach
Beiträge: 382
17. Mär 2004, 15:10
Beitrag #2 von 4
Beitrag ID: #75486
Bewertung:
(559 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

unterschiedliche rollovereffekte mit css


so sieht übriegens die ganze seite aus:

<HTML>
<HEAD>

<style media="screen" type="text/css"><!--
#Ebene9 { position: absolute; z-index: 21; top: 114px; left: 67px; width: 273px; height: 281px; visibility: visible }
#Ebene8 { position: absolute; top: 119px; left: 473px; width: 259px; height: 269px; visibility: visible }
--></style>
<style type="text/css" media="screen"><!--A:link { color: #B44605; text-decoration: none }
A:visited { color: #B44605; text-decoration: none }
A:hover { color: #7A2F07; text-decoration: underline }
A:active { color: #B44605; text-decoration: none }


--></style>
</HEAD>
<BODY BGCOLOR=#f78513 leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" link="#b44605" vlink="#b44605" alink="#b44605" text="#730f05">
<div id="Ebene8">
<font size="2" face="Arial">Wir haben viel Spaß bei der Arbeit...<br>
</font></div>
<div id="Ebene9">
<p><font size="2" face="Arial">Wir schulen und fördern viel...<br>
</font></p>
</div>
</BODY>
</HTML>
als Antwort auf: [#75481] Top
 
SabineP  M 
Beiträge: 7586
17. Mär 2004, 15:23
Beitrag #3 von 4
Beitrag ID: #75490
Bewertung:
(559 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

unterschiedliche rollovereffekte mit css


Du kannst verschiedene Klassen anlegen.

a.menue:hover {color:#C49F35; font-size:12px; text-decoration:none}

<style type="text/css" media="screen"><!--
A.ersteklasse:link { color: #B44605; text-decoration: none }
A.ersteklasse:visited { color: #B44605; text-decoration: none }
A.ersteklasse:hover { color: #7A2F07; text-decoration: underline }
A.ersteklasse:active { color: #B44605; text-decoration: none }

A.zweiteklasse:link { color: #ff0000; text-decoration: none }
A.zweiteklasse:visited { color: #00ff00; text-decoration: none }
A.zweiteklasse:hover { color: #0000ff; text-decoration: underline }
A.zweiteklasse:active { color: #ff00000; text-decoration: none }

--></style>

und im HTML-Code die Klassen zuweisen:

<a class="ersteklasse" href="seite.html">Link erhält die Farben von ersteklasse</a>

<a class="zweiteklasse" href="seite.html">Link erhält die Farben von zweiteklasse</a>

Gruß Sabine
als Antwort auf: [#75481] Top
 
sukoshi
Beiträge: 73
23. Mär 2004, 13:24
Beitrag #4 von 4
Beitrag ID: #76391
Bewertung:
(559 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen

unterschiedliche rollovereffekte mit css


Hi,
alternativ könnte man auch so vorgehen, dass die "div id" als Unterscheidung dient:

#ebene8 a:hover { color: rgb( 114, 120, 130 ); }
#ebene9 a:hover { color: rgb( 20, 40, 50); }

Auf die Art und Weise spart man sich die Benutzung der Klasse und kann wie gesagt über den 'div' - tag die entsprechenden Zuweisungen erledigen.

Nur so eine Idee

Sukoshi

BTW: die Farben in dem Beispiel hab' ich nicht ausprobiert, also bitte selbst was augenfreundliches raussuchen ;-)
als Antwort auf: [#75481] Top
 
X