Link auf HP wo man grade drauf ist farbig hinterlegt?!

[versuch13]

@c2uk: Es geht nicht darum wann du was geschrieben hast, sondern was du geschrieben hast. Ich wollte dich ja nicht beleidigen, sorry, sag ja nur wie es aussieht. Und hallo? Hast du nicht gerade selbst zu pseudo klasse
active geraten?

@SnakeBite334: Id s für Links zu vergeben ist nicht gerade das beste, entweder klassen, oder gar nichts. Dann setzt du den style so wie oben einfach in den head, dieser bezieht sich dann auf alle Links im Dokument.

MfG

 

[c2uk]

Mir gefällt Dein Ton trotzdem nicht, ich habe fast zur gleichen Zeit wie Du geschrieben, ich kann doch nicht riechen, dass gerade jemand hier auch antworten will? Außerdem habe ich nicht das gleiche geschrieben wie Du:

Es tut mir schrecklich Leid, aber les Dir meinen Beitrag nochmals durch, ich habe nicht zur Pseudoklasse active geraten, ich habe eine id geschaffen mit dem Namen active, damit klar aus dieser hervorgeht, dass es sich um den aktiven Link handeln soll. Ich denke das sollte sogar für css-Anfänger klar sein, dass ich nicht die Pseudoklasse :active verwendet habe.

Und wenn man dieses nur einmal in der Seite benutzen möchte kann man auch ruhig IDs benutzen. Und ich denke wenn es darum geht den aktiven Link hervorzuheben, benutzt man diesen nur einmal. Im Endeffekt ist es natürlich egal, ich halte mir aber gerne in meiner CSS Datei (ich hatte ja extra geschrieben im CSS Bereich, ob das jetzt in der html-Seite mit drin steht oder in einer externen Datei liegt ist in dem Moment doch egal, ich will ja einen css-Anfänger nicht gleich zubomben mit Infos) Ordnung, und da gehört nunmal dazu, dass ich Sachen, die ich nur einmal pro Seite verwende, eine ID gebe und keine Klasse.

Und jetzt zu kommen, dass IDs nichts sind für Links, also bitte? Du kannst IDs noch nicht mal von Pseudoklassen unterscheiden, woher kennst Du bitte dann den Unterschied zwischen Klassen und IDs und wann was nützlich ist?

 

[versuch13]

@c2ukok, danke, man lernt ja nie aus!

 

[Maik]

Hallo,

hier mal ein Beispiel für ein Listenmenü, das auf der geöffneten (aktiven) Seite den entsprechenden Menü-Link optisch markiert:

CSS-Code:

#listmenu
{
margin-left: 0;
padding-left: 0;
}

#listmenu li
{
display: block;
list-style-type: none;
margin: 0 0 3px 0;
}

#listmenu a
{
padding: 3px;
width: 160px;
border: 1px solid #304b64;
text-align: center;
}

#listmenu a:link, #listmenu a:visited
{
text-decoration: none;
padding: .2em 1em;
color: #304b64;
font-weight: bold;
border: 1px solid #304b64;
}

#listmenu a:link.active, #listmenu a:visited.active
{
padding: .2em 1em;
color: #90abc4;
font-weight: bold;
border: 1px solid #304b64;
border-left: 10px solid #90abc4;
}

#listmenu a:hover
{
padding: .2em 1em;
color: #90abc4;
font-weight: bold;
border: 1px solid #304b64;
border-left: 10px solid #90abc4;
}

HTML-Code:

<ul id="listmenu">
       <li><a class="active" href="#">item 1</a></li>
       <li><a href="#">item 2</a></li>
       <li><a href="#">item 3</a></li>
        <li><a href="#">item 4</a></li>
</ul>

So wird in jeder einzelnen Seite das class-Attribut im entsprechenden Menü-Link notiert:

<ul id="listmenu">
      <li><a href="#">item 1</a></li>
      <li><a class="active" href="#">item 2</a></li>
      <li><a href="#">item 3</a></li>
      <li><a href="#">item 4</a></li>
</ul>

usw.

greez, maik.l

 

[c2uk]

Genau das wollt ich nämlich nicht, einen offensichtlichen (sorry Snake falls Du kein css-Anfänger sein solltest, aber Dein erster Post lässt daraus schließen) css-Anfänger mit zu viel Infos überhäufen.

 

[SilentWarrior]

Ihr solltet euch mal mit dem Thema semantisches Markup beschäftigen. a:active bezeichnet lediglich die Situation, in der der Link angeklickt wird. Mal abgesehen von der Tatsache, dass das ohnehin nur mit Framesets funktioniert (die man aber aus bekannten Gründen nicht mehr verwenden sollte), verschwindet diese Hervorhebung, sobald der User irgendwoanders hinklickt - was durchaus vorkommen kann, z. B. bei Formularen.

Ideal ist diese Lösung also bei weitem nicht.

 

[hela]

Hallo,

ich würde es ohne Rücksicht auf evtl. Informationsüberflutung in diesem Thread so machen, wie hier (Anzeige des aktuell gewählten Menüpunktes) vorgeschlagen wird:

• Jedem Link in der Navigation einen eindeutigen Klassennamen geben.
• Die Navigation mit einem umschließenden Block versehen, der eine eindeutige ID für die aktuelle Seite trägt.
• In der CSS nach der allgemeinen Formatierung der Navigation einen kontextsensitiven Selektor mit den Linkformatierungen für die aktuelle Seite einfügen.

Hat man beispielsweise 4 Menüpunkte, dann würden die entsprechenden Stylesheets so aussehen:

       #navigation a {
         	/* globale Eigenschaften der Links */
         }
         #navigation a:link, #navigation a:visited {
         	/* Eigenschaften für besuchte und unbesuchte Links */
         }
         #navigation a:hover, #navigation a:focus {
         	/* hover- und active-Eigenschaften der Links */
         }
         #id1 #navigation a.c1, #id2 #navigation a.c2, #id3 #navigation a.c3, #id4 #navigation a.c4 {
         	/* Eigenschaften des Links der aktuellen Seite */
        }

Und der zugehörige HTML-Quelltext z.B. der Seite3, wenn das Menü als Liste ausgegeben wird:

<div id="id3"><div id="navigation">						 
 <ul>														 
           <li><a class="c1" href="#">Menüpunkt 1</a></li>
           <li><a class="c2" href="#">Menüpunkt 2</a></li>  
           <li><a class="c3" href="#">Menüpunkt 3</a></li> <!-- Menüpunkt der aktuellen Seite -->
           <li><a class="c4" href="#">Menüpunkt 4</a></li>  
 </ul>														 
         </div></div>

Die Seiten-ID (hier "id3") kann ja u.U. per PHP eingefügt werden.

 

[Thomas Lindner]

Ruhiger werden Jungs - kein Grund sich bei fast zeitgleichen Post und/oder unterschiedlichen Meinungen hier anzumaulen...

Also back2topic und die Hahnenkämpfe einstellen!