Ostatnio edytowany:

:enabled

Autor: Virtual Patriot

Przeznaczenie selektora :enabled

      :enabled { ... }
    

Selektor :enabled odwołuje się do każdego elementu HTML, którego cechy w danym momencie spełniają zasadę pseudoklasy :enabled.

Cechy elementu HTML spełniają zasadę pseudoklasy :enabled, gdy w danym momencie dany element HTML nie został wyłączony (na przykład za pomocą atrybutu disabled) z możliwości interakcji z użytkownikiem.

Dodatkowe techniczne informacje o selektorze :enabled

ograniczenie - elementy HTML
ograniczenie - właściwości CSS
  • brak

Przykładowa reguła CSS, selektor :enabled

input:enabled {
  background-color:red;
}

Wyjaśnienie przykładowej reguły CSS

      input:enabled { background-color:red; }
    
input:enabled

Do każdego elementu input, który nie został wyłączony z możliwości interakcji z użytkownikiem

background-color

dodaj właściwość CSS, która zmieni kolor tła elementu HTML

red

na barwę czerwoną

Kod źródłowy przykładowego dokumentu HTML

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      input:enabled {
        background-color:red;
      }
    </style>
  </head>

  <body>

    <label>
      Podaj dowolny ciąg znaków: <input type="text">
    </label>

    <hr>

    <label>
      Podaj nazwę koloru: <input type="text" disabled>
    </label>

  </body>
</html>

Rezultat


Tylko element "input", który nie posiada atrybutu "disabled" ma czerwony kolor tła.

Interpretacja selektora :enabled

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

tak, lecz od wersji 9

Edge

tak

Zobacz więcej informacji o interpretacji selektora .