Link unterstreichen?

[keop]

Hallo zusammen!

Kann mir jemand weiterhelfen?
Ich möchte, dass ich wenn ich über einen Link drüberfahre der Unterstrich kommt. Nicht aber schon wenn ich ein Wort als Link definiere.

Vielen Dank für die Antworten
MfG -Keop-

[Flixxtoras]

PHP-Code:

<style>
<!--
      A:link { text-decoration: none; color: #000000;}
      A:visited { text-decoration: none; color: #000000;}
      A:active { text-decoration: none; color: #000000;}
      A:hover { text-decoration: underline; color: F90000;}
-->
</style> 


Einfach in den Head Teil einfügen!

[Flixxtoras]

Fals dir das oben nicht viel hilft schau mal auf Dr.Web.de

hier der Link:

http://www.ideenreich.com/trickkiste/tricks13.shtml

[keop]

Danke mal für die Antworten!

Aber funktioniert dies mit den CSS in einer Bibliothek´in DW3

MfG -Keop-

[Flixxtoras]

Ja natürlich kann man es auch extern abspeichern und dann in der CSS Bibliotek einfügen.

1. in den Head der Seite einfügen wo die Linkformatierungen (CSS) eingefügt werden sollen.

PHP-Code:

<link rel="stylesheet" href="seite.css" type="text/css"> 


2. eine Datei in dem fall seite.css erstellen. Mit dem Inhalt:

PHP-Code:

Body { 
A:link { text-decoration: none; color: #000000;}
A:visited { text-decoration: none; color: #000000;}
A:active { text-decoration: none; color: #000000;}
A:hover { text-decoration: underline; color: F90000;}
} 


3. In Dreamweaver: CSS Styles -> unten rechts open Style.

[keop]

Danke für die schnellen Antworten?

Möchte aber das dieses Stylesheet nur für einen Teil der Seite gültig ist, nicht für die ganze Seite?

Vielen Dank für die Antworten
MfG -Keop-

[Lars]

Original geschrieben von Flixxtoras

PHP-Code:

<style>
<!--
      A:link { text-decoration: none; color: #000000;}
      A:visited { text-decoration: none; color: #000000;}
      A:active { text-decoration: none; color: #000000;}
      A:hover { text-decoration: underline; color: F90000;}
-->
</style> 


Einfach in den Head Teil einfügen!

Damit das auch bei bereits besuchten Links funktioniert, muss aber noch eine Pseudo-Klasse definiert werden:

a.hover {text-decoration:underline;color:#F90000}

Desweiteren dollte man auf die Leerzeichen verzichten und das "active" nach ganz unten bzw. hinten stellen.

[Flixxtoras]

Sorry Schnobi das die Leerzeichen dazwischen sind!
Stimmt natürlich!
@Wegen deiner Frage schau doch mal im forum nach da sind mindestens 3 Threads dazu!

[Lars]

Ich wollte aber auf keinen Fall kleinlich wirken!

[Flixxtoras]

Is Ok weist du eine Lösung aud die Frage von keop. Ich weis nur das es schon mehreremale im Forum gepostet wurde!

[Lars]

huch, die hatte ich ganz überlesen...

Hier also eine Lösung, welche zeigt, wie man Klassen auf Pseudo-Klassen anwendet:

<style type="text/css">
<!--
a:link      {color:#0033cc;text-decoration:none}
a:active    {color:#0033cc;text-decoration:none}
a:visited   {color:#0033cc;text-decoration:none}
a:hover     {color:#0033cc;text-decoration:underline}
a.hover     {color:#0033cc;text-decoration:underline}

a.spezial:link      {color:#006666;text-decoration:none}
a.spezial:active    {color:#006666;text-decoration:none}
a.spezial:visited   {color:#006666;text-decoration:none}
a.spezial:hover     {color:#006666;text-decoration:underline}
a.spezial.hover     {color:#006666;text-decoration:underline}

//-->
</style>

[...]


<a href="#">Link1</a>

<a href="#" class="spezial">Link2</a>

Sieht wild aus, ist aber CSS-konform.

[Flixxtoras]

Danke auch von mir jetzt weis ich wie es klappt!