: deaktiveret - CSS-tricks

Anonim

Den :disabledpseudo-class selector giver betinget styling til HTML-elementer, der kan modtage brugerinput, når elementerne har disabledattribut. Det er defineret i CSS Selectors niveau 3 spec som en “UI element state pseudo-class”, hvilket betyder at den bruges til at style indhold baseret på brugerens interaktion med et input element.

Elementer, der kan modtage den disabledattribut omfatter , , , , og . Der er to gyldige syntakser til indstilling af denne attribut: enten disabled="disabled"eller (i HTML5) simpelthen det disabledboolske nøgleord. Et element er deaktiveret, hvis det ikke kan aktiveres (f.eks. Valgt, klikket på eller accepter tekstindtastning) eller acceptere fokus.

Et sådant element kan styles ved hjælp af :disabledpseudoklassevælgeren:

Tjek denne pen!

Interessepunkter

  • :disabledkan "lænkes" sammen med andre pseudovælgere: som :beforeeller :aftertil at generere ikoner eller tekst for at give mere brugerfeedback.
  • Enhver ejendom, der kan animeres med CSS-overgange eller animationer, animeres korrekt, når disabledattributten tilføjes eller fjernes fra HTML-elementet.

Browsersupport

Chrome Safari Firefox Opera IE Android iOS
Alle 3.1 Alle 9 9 Alle Alle