Ciao mi chiamo Jacopo! Sono un UX/UI Designer e Front End Developer. Sul mio sito troverai articoli sullo sviluppo Front End

La pseudo classe :active viene utilizzata per rappresentare un elemento attivo nella pagina, di solito quando l'utente clicca su un bottone o su un link.

    /* Attiva un elemento <a> */
    a:active {
      color: #E50914;
    }

La pseudo classe :active viene solitamente utilizzata per gli elementi <a> e <button>, ma può essere usata anche su elementi che contengono un elemento attivo o neii form attivati attraverso la loro <label>.

Gli stili definiti dalla pseudo classe :active, vengono sovrascritti da una qualsiasi pseudo classe con almeno le stesse specifiche (:link, :hover o :visited). Per poter apporre correttamente gli stili, mettete la regola :active dopo tutte le altre regole.

Potete seguire l'ordine LVHA

:link - :visited - :hover - :active.

Esempio

Compatibilità browser

Desktop

  • Chrome 1
  • Edge 12
  • Firefox 1
  • Internet Explorer 4 (Supporto elementi non -a dalla 8)
  • Opera 5 (Supporto elementi non -a dalla 7)
  • Safari 1

Mobile

  • Android webview 1
  • Chrome per Android 18
  • Firefox per Android 4
  • Opera per Android 10.1 (Supporto elementi non -a ?)
  • Safari per iOS 1 (Supportato anche se iOS non usa :active finché non c'è un evento touchstart sull'elemento o nel body dell'elemento)
  • Samsung Internet ?
Ti sei iscritto con successo al blog di Jacopo Kahl - UX/UI Designer e Front End Developer
Bentornato! Hai effettuo l'accesso al blog.
Ottimo! Ti sei appena registrato.
Perfetto! Il tuo account è attivo, ed hai l'accesso a tutti i contenuti.