Computerhilfen.de Logo
Forum
Tipps
News

CSS-Background Hover Problem

Hallo, ich habe eine HTML-Datei erstellt, in denen die Links in einzelnen Spalten stehen... nun habe ich eine CSS-Datei gemacht. Ich möchte, dass wenn ich über diese Links mit der Mouse fahre, dass sich der Hintergrund der Zeile, bzw. Spalte eine bestimmte Farbe färbt... wie mach ich das?

GRuß
iced.


Antworten zu CSS-Background Hover Problem:

Ach ja - die Seite findet ihr unter:
http://project-evolution.de/NEWGAMERPAGE/

GRuß
iced.

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button
Na machs am Besten damit :

a /* Definition der Links im "Normalzustand" */
{
cursor: pointer; /* Beim Drüberfahren ändert sich der Mauszeiger */
display: block; /* Die Hover-Eigenschaften gelten für die ganze Höhe und Breite des Links */
color: #969696; /* Farbe der Links */
padding: 2px 4px 4px 8px; /* Abstand zum Rand des LINKS */
margin: 1px 0px; /* Rand (nur beim Drüberfahren) */
text-decoration: none; /* Keine Text "Verziehrung" */
font-size: 0.92em; /* Schriftgröße der Links */
}

a:hover /* Formatierung der Links beim Drüberfahren */
{
border: 1px solid #DDDDDD; /* Hellgrauer (#DDDDDD) Rahmen von 1px  /*
margin: 0px; /* Auch hier kein Rand /*
padding: 2px 4px 4px 7px; /* Abstand zum Rand (Rahmen) /*
background-color: #000000; /* Hintergrundfarbe des Links /*
color: #0099FF; /* Farbe des Links beim Drüberfahren */
text-decoration: none; /* Auch hier keine Textverziehrung */
}

Kannst du natürlich noch abändern, aber wichtig ist display: block

... Ich wollte es eigentlich mit Spalten und Zeilen machen hier ein paar Fetzen Code:

<tr class="linkbg">
      <td class="linkbg"><a href="index.php?show=gamingnews">Gaming.News</a></td>
    </tr>

Und dazu der CSS-Code:

.linkbg {
background:#ffffff;
}

.linkbg:hover {
background:#cccccc;
}

Aber das funktioniert nicht... warum? :(

GRuß
iced.

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button
Also so geht das ja schonmal nicht, das class="linkbg" muss ja schon auf den Link bezogen sein, also

[b]<a href="index.php?sow=gamingnews" class="linkbg">Gaming.News</a>[/b]

Das ganze erreichst du dann hiermit :

a.linkbg {
color: #000000;
background-color: #FFFFFF;
display: block;
width: 100px;
height: 10px;
}

a.linkgb:hover {
background-color: #CCCCCC;
width: 100px;
height: 10px;
}

Die Höhe und Breite muss man dabei manuell anpassen.

Ich würde dir aber trotzdem dazu raten, die ganze Homepage mit CSS zu machen, das hat einige Vorteile. Ein Beispiel bzw. Tutorial findest du hier :

http://www.derolleschwoebel.de/links-tipps_specialeffects.php#spaltenlayout

Da gibts ein komplett auskommentiertes Beispiel zum "Einbau" und Download des Beispiels..

Tabellen sind ja, wie ich auch lernen "durfte" keine Strukturhilfe ;)

« Hintergrund mit glanzEigenen PC soll Server spielen »
 

Schnelle Hilfe: Hier nach ähnlichen Fragen und passenden Tipps suchen!