Mozilla's getting a new look. What do you think? https://mzl.la/brandsurvey

Übersicht

Die Pseudoklasse :active entspricht jedem Element, dass vom Benutzer aktiviert wurde. Beim Mauszeiger ist das die Zeitspanne, wo die Taste gedrückt gehalten wird. Deshalb wird sie meistens bei den Elementen <a> und <button> Eingesetzt, kann aber auch für jedes andere Element genutzt werden.

Die Stile können von weiteren Pseudoklassen überschrieben werden: :link, :hover und :visited. Deshalb ist es wichtig, die LVHA-Reihenfolge einzuhalten: :link:visited:hover:active.

Hinweis: Auf Systemen mit Mäusen mit mehreren Knöpfen, definiert CSS 3, dass die :active Pseudoklasse nur dem Hauptknopf zugewiesen wird; bei Mäusen für Rechtshänder ist dies typischerweise der linkeste Knopf.

Beispiel

HTML

<body>
    <h1>:active CSS selector example</h1>
    <p>The following link will turn lime during the time you click it and release the click: <a href="#">Mozilla Developer Network</a>.</p>
</body>

CSS

body { background-color: #ffffc9 }
a:link { color: blue } /* unbesuchte Links */
a:visited { color: purple } /* besuchte Links*/
a:hover { font-weight: bold } /* Benutzer fährt mit der Maus darüber */
a:active { color: lime } /* aktive Links */

Spezifikationen

Spezifikation Status Kommentar
Selectors Level 4
Die Definition von ':active' in dieser Spezifikation.
Arbeitsentwurf Keine Änderung
Selectors Level 3
Die Definition von ':active' in dieser Spezifikation.
Empfehlung Keine Änderung
CSS Level 2 (Revision 1)
Die Definition von ':active' in dieser Spezifikation.
Empfehlung Keine Änderung
CSS Level 1
Die Definition von ':active' in dieser Spezifikation.
Empfehlung Standard Wert definiert

Browser Kompatibilität

Merkmal Chrome Firefox (Gecko) Internet Explorer Opera Safari
Grundlegende Unterstützung 1.0 1.0 (1.7 oder früher) 4.0 5.0 1.0
Unterstützung bei anderen Elementen als <a> 1.0 1.0 (1.7 oder früher) 8.0 7.0 ?
Merkmal Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Grundlegende Unterstützung 1.0 1.0 (1.0) 6.0 6.0 1.0[1]
Unterstützung bei anderen Elementen als <a> 1.0 1.0 (1.0) ? ? ?

[1] Standardmäßig verwendet Safari Mobile nicht den :active Status, außer es gibt einen touchstart Event Handler für das entsprechende Element oder das <body> Element.

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

 Mitwirkende an dieser Seite: jwhitlock, yckart, Sebastianz, webtobesocial, SJW
 Zuletzt aktualisiert von: jwhitlock,