Zum Inhalt springen
View in the app

A better way to browse. Learn more.

Fachinformatiker.de

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

link gestaltung mit css

Empfohlene Antworten

Veröffentlicht

Servus...

ich flipp gleich aus.

Ich mache eine dynamische navigation und möchte, dass der gerade gewählt menüpunkt meiner navigation hervorgehoben wird (habe keine frames).

Der code wir überwiegend mit php generiert. Nun habe ich es geschafft, dass dyamisch in den zu hervorhebenden link ein

class="aktivlink"

hineinbekomme. Aber im browser sieht man keine Auswirkung. Da werden die links immer mit farben von "besuchten" und "aktiven" links dargestellt.

Wenn ich mit css a:active und a:hover was reinschreib dann wird meine css class auch wieder ingoriert.

Ich mache eine dynamische navigation und möchte, dass der gerade gewählt menüpunkt meiner navigation hervorgehoben wird

<a href="..." onclick="this.className='aktivlink';">

probier das mal.

Damit schaltest du nur die anderen nicht aus. Du könntest aber eine Schleife über alle Links im Dokument machen und die Klasse dort auf nicht aktiv setzen.

EDIT: kannst du auch mit onmouseover etc. machen

JavaScript wird garnicht benötigt für sowas. Gibt es überhaupt im CSS eine Klasse, die aktivlink heißt? Wie's aussieht nämlich nicht. Btw. der aktive Menüpunkt sollte kein Link sein.

Via CSS geht es z. B. so:

a.aktivlink:hover { color: yellow; text-decoration: underline; }

also "aktivlink" war eine von mir erstellt klasse.

Da ich viel mit php mache funktionieren die a:visited a:active nicht bei mir. Deshalt wollte ich den links dynamisch klassen zuweisen für die Formatierung. Aber die werden nie so dargestellt wie ich das festgelegt habe, sonder immer nach diesen a:xy Formatierungen.

Wie kann ich das "abstellen"?

Javascript möchte ich vermeiden.

nächstes Problem.

Generiere diesen Quelltext

<td><span class='aktivlink'>Startseite</span></td>
(Natürlich in einer kompletten Tabelle) In der html datei wird auf eine css Datei verwiesen in der das steht:

aktivlink{

	color:#33FF33;

}

Aber es wird nicht so dargestelllt (Browser ist nicht schuld; getestet)

Das Stylesheet wird schon "erkannt" da andere Formatierungen funktionieren.

vielleicht an den Haaren herbeigezogen, aber schon mal daran gedacht, das ganze umzubenennen? Es gibt ja die Pseudoklassen active und link.

Es müssen dort ja alle Werte gesetzt werden, da sie sonst die eigene Definition ignorieren. Das ist dann auch kein Browserbug sondern eine Festlegung von CSS.

also dummer Fehler von mir. Hab den . vor der klasse vergessen.

Also es funktioniert jetzt, da ich ja den "aktiven" Menüpunkt kein link mehr ist.

Aber könnte man theoretisch einen link nicht auch mit einer eigenen Klasse formatieren? Oder ist das so festgeschrieben, dass die a:active a:rollover das immmer "überschreiben"?

hallo du kannst für jeden Link extra formatierungen durchführen, natürlich nicht wieder den Punkt vergessen :)

A:hover.r

das r ist natürlich optional, es werden aber zusätzlich die Formatierungen von a:hover übernommen, also alles was anders sein soll, mit aufnehmen.

Gruss

Sabine

JavaScript wird garnicht benötigt für sowas. Gibt es überhaupt im CSS eine Klasse, die aktivlink heißt? Wie's aussieht nämlich nicht. Btw. der aktive Menüpunkt sollte kein Link sein.

Dav mit Hover funktioniert aber nur, solange die Maus über dem Link ist. Mit Javascript kannst du auch den gerade aktuell gewählten Link entsprechend markieren (von daher stammt mein Beispiel auch).

Und wie du sagst, muss es ein Link sein. die Pseudo-Klassen :hover etc. gibt es ansich für alle Tags, nur der IE kennt das ganze eben nur für Links. :rolleyes:

ich glaub ihr versteht nicht ganz was ich meine

ich möchte, dass das funktioniert:

<td><a class="meineklasse" href="xy.php">blabla</a></td>

tut es aber nicht wegen dem a:hover und so

Irgendwie kapiers ich nicht :)

A:link.meineklasse {

.... }

A:visited.meineklasse{

...}

A:hover.meineklasse {

... }

A:active.meineklasse {

}

sollte so funktionieren, wenn du was auslässt, werden die Formatierungen von den A:link, usw übernommen.

Gruß

Sabine121

muss es nicht so heissen:

A.meineklasse:link

:confused: du hast recht, habe gerade in meiner CSS Fibel nachgeschaut,

:eek: aber wie ich es gemacht habe, funzt das auch :OD

kommt davon, wenn man einfach losschreibt und nicht nachschaut

Gruß

Sabine

Archiv

Dieses Thema wurde archiviert und kann nicht mehr beantwortet werden.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.