31. :default - CSS3

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>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>