Autor publikacji
Virtual Patriot - Administrator

:default

Data publikacji
Ostatnio edytowano

Przeznaczenie selektora :default

      :default { ... }

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

Cechy elementu HTML spełniają zasadę pseudoklasy :default, gdy w danym momencie dany element HTML traktowany jest przez przeglądarkę internetową jako jeden z elementów domyślnych danego zbioru elementów HTML.

Informacje techniczne o selektorze :default

ograniczenie - elementy HTML

  • pierwszy w kolejności (w danym momencie) element button, który służy do zatwierdzenia formularza HTML, z którym został powiązany

  • pierwszy w kolejności (w danym momencie) element input, który służy do zatwierdzenia formularza HTML, z którym został powiązany

  • element input typu checkbox posiadający w danym momencie atrybut checked

  • element input typu radio posiadający w danym momencie atrybut checked

  • element option posiadający w danym momencie atrybut selected

ograniczenie - właściwości CSS

brak

Przykładowa reguła CSS, selektor :default

button:default {
  outline:3px solid red;
}

Wyjaśnienie przykładowej reguły CSS

      button:default { outline:3px solid red; }
button:default

do każdego elementu button, który jako pierwszy w kolejności służy do zatwierdzenia formularza HTML, z którym został powiązany

outline

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

3px solid red

na obrys o szerokości trzech pikseli, stylu solid oraz kolorze czerwonym

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

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

    <style>
      button:default {
        outline:3px solid red;
      }
    </style>
  </head>

  <body>

    <form action="https://webkod.pl/php/submit-result.php">
      <label>
        Podaj imię:
        <input type="text" name="imie">
      </label>

      <button type="submit" formmethod="get">zatwierdź - 1</button>
      <button type="submit" formmethod="post">zatwierdź - 2</button>
    </form>

  </body>
</html>

Rezultat

Zmieniony styl wyglądu swojego obrysu posiada tylko ten element "button", który jako pierwszy w kolejności służy do zatwierdzenia formularza HTML, z którym został powiązany.

Interpretacja selektora :default

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

nie

Edge

tak

Zobacz więcej informacji o interpretacji selektora .