a mouseover class ändern

022.9 · 16.02.2005, 16:19

hy, ich habe da ein problem.. ich habe einen link per class und css gemacht. nun möchte ich, dass wenn ich mit der mause über den link gehe, dieser die farbe wechselt (vielleicht auch noch einen hintergrund bekommt, das weiß ich aber noch nicht genau). eigentlich ja recht einfach. nur, ich habe noch eine andere art link-type, der in eine andere art von farbe wechseln soll.

Code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>TEST</title>
<link rel="stylesheet" type="text/css" href="code/css.css" media="screen">
</head>
<body>
<table width="100%" class="toptabelle" cellpadding="0" cellspacing="0">
<tr>
<td>Wir über uns</td>
<td></td>
<td>Termine</td>
<td></td>
<td>Kontakt</td>
<td></td>
<td>Geschichte</td>
</tr>
<tr>
<td colspan="7"><iframe name="body" width="980" frameborder="0" height="530" src="code/body.html"></iframe></td>
</tr>
<tr>
<td colspan="7"><div style="border:0; position:absolute; bottom:0px">[img]grafiken/lilietransp.gif[/img]</div><center>Letzte Aktualisierung am 16.02.2005</center></td>
</table>
</body>
</html>

das ist die html datei und das die css

Code:

body{background-color:#FFFFFF; background-image:url(../grafiken/background.gif);}

.toptabelle{background-color:#EFEFEF; background-image:url(../grafiken/background.gif);}

.toplink{color:#333333; text-decoration:none; font-size:18px;}

p{color:#3300CC; text-decoration:none;}

.link{color:#999999; text-decoration:none;}

.linkmouseover{color:#000099; text-decoration:none;}

ich hoffe ich habe mich verständlich ausgedrückt??

der link soll von der class "link" in die class "linkmouseover" wechseln (oder irgendwie anderweitig die farbe wechseln)

schonmal vielen dank für eure mühe

17.02.2005, 00:29

Wenn Du die Links mit CSS gestalten willst, brauchst Du folgende Linkeigenschaften:

:link {
.....
}

:hover {
........
}

:visited{
.........
}

:active{
.........

}

:focus{
.........
}

Die Eigenschaften (wie z.B. font-family oder text-decoration) kommen zwischen geschweiften Klammern.

17.02.2005, 14:47

Das heißt:
a:link {
font-size: 12px;
}

Das hilft dir aber nicht weiter, da du zwei verschiedene Typen verwänden willst. mach einfach Folgendes in deine CSS- Datei.

div.cssmenu a:link {
font-size: 10px;
}

Und in dein html- Dokument:

<div class="cssmenu">
LOL
</div>
COOL

imported_Ben · 17.02.2005, 15:30

Du musst auch auf die Reihenfolge der Pseudoklasse achten

022.9 · 18.02.2005, 15:51

dann sieht die css datei jetzt also so aus:

Code:

div.cssmenu a:link {
font-size: 20px;
} 

div.cssmenu a:visited {
font-size: 10px; color:#999999;
} 

div.cssmenu a:active {
font-size: 20px;
} 

div.cssmenu a:hover {
font-size: 40px;
}

und der quelltext dann so:

Code:

<div class="div.cssmenu">hier

tütütüt</p></div>

heißen dank! es geht wunderbar!!

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Class kann auf Variable nicht zugreifen...	go1denboy	PHP Tipps 2008	4	27.06.2008 15:40
MySQL Abfrage als PHP class	d3rbastl3r	PHP Tipps 2008	2	11.06.2008 15:41
Headerwechsel per Mouseover	tinchen	HTML, Usability und Barrierefreiheit	8	26.11.2006 23:06
MySQL class	test022	Trash	1	25.09.2006 22:14
CSS Class zuweisen	Steffen Mayer	PHP Tipps 2006	4	26.05.2006 12:44
Class Vars	fmueller	PHP Tipps 2006	10	14.02.2006 19:54
[OS\|FreeGW] Class Problem ( cl_extended_database )		PHP Tipps 2006	20	08.02.2006 01:09
Class in PhP		PHP Tipps 2007	16	23.12.2005 16:09
Mehrere Div-Layer per Class schliessen	Diego1978	HTML, Usability und Barrierefreiheit	4	02.12.2005 12:10
PHP Class Datei Basirende Datenbank mit MySQL Syntax	atom-dragon	Beitragsarchiv	4	01.08.2005 06:57
Thema: class; Problem: Grundlegende :)		PHP Tipps 2005-2	4	13.07.2005 18:40
bb stringparser class	search	Beitragsarchiv	4	14.04.2005 18:18
Class -- Funktion	Creativ	PHP Tipps 2005	2	30.03.2005 23:10
Klassenschachtelung -&gt; Cannot Redeclare Class ... Fehler		PHP-Fortgeschrittene	5	21.10.2004 18:04
funktions-name in class ausgeben		PHP Tipps 2004	1	23.06.2004 13:48


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

17.02.2005, 00:29
Gast Beiträge: n/a	Wenn Du die Links mit CSS gestalten willst, brauchst Du folgende Linkeigenschaften: :link { ..... } :hover { ........ } :visited{ ......... } :active{ ......... } :focus{ ......... } Die Eigenschaften (wie z.B. font-family oder text-decoration) kommen zwischen geschweiften Klammern.

17.02.2005, 14:47
Gast Beiträge: n/a	Das heißt: a:link { font-size: 12px; } Das hilft dir aber nicht weiter, da du zwei verschiedene Typen verwänden willst. mach einfach Folgendes in deine CSS- Datei. div.cssmenu a:link { font-size: 10px; } Und in dein html- Dokument: <div class="cssmenu"> LOL </div> COOL

17.02.2005, 15:30
imported_Ben Erfahrener Benutzer Registriert seit: 18.09.2003 Beiträge: 13.598 PHP-Kenntnisse: Fortgeschritten	Du musst auch auf die Reihenfolge der Pseudoklasse achten __________________ Webentwickler-Blog - Buchbesprechung PHP Design Patterns - SQL-Antipatterns

18.02.2005, 15:51
022.9 Benutzer Registriert seit: 13.10.2003 Beiträge: 38 PHP-Kenntnisse: Anfänger	dann sieht die css datei jetzt also so aus: Code: div.cssmenu a:link { font-size: 20px; } div.cssmenu a:visited { font-size: 10px; color:#999999; } div.cssmenu a:active { font-size: 20px; } div.cssmenu a:hover { font-size: 40px; } und der quelltext dann so: Code: <div class="div.cssmenu">hier tütütüt</p></div> heißen dank! es geht wunderbar!! __________________ Ich habe eine eigene Meinung und die ist überzeugt von dem was ich sage