Ostatnio edytowany:

placeholder

Autor: Virtual Patriot

Przeznaczenie atrybutu placeholder

Za pomocą atrybutu placeholder możemy określić tekst, który powinien pojawić się w widocznym obszarze interesującego nas elementu HTML, gdy wspomniany element HTML nie reprezentuje w danej chwili żadnej innej treści.

Elementy HTML dla atrybutu placeholder

  1. input
  2. textarea

Przykład atrybutu placeholder

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

    <form action="http://webkod.pl/php/submit-result.php">
      <label>
        Podaj czterocyfrową liczbę:
        <input type="text" name="liczba" pattern="[0-9]{4}" placeholder="np. 1410" required>
      </label>

      <button type="submit">zatwierdź</button>
    </form>

  </body>
</html>

Rezultat

W momencie gdy przykładowy element "input" nie reprezentuje żadnej treści, czyli w momencie gdy dana reprezentowana przez wspomniany element "input" posiada wartość pustą, wtedy w widocznym obszarze wspomnianego elementu "input" jest widoczny ciąg znaków "np. 1410", ponieważ do wspomnianego elementu "input" został dodany atrybut "placeholder" wraz z wartością "np. 1410".

Interpretacja atrybutu placeholder

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

tak, lecz od wersji 10

Edge

tak

Zobacz więcej informacji o interpretacji atrybutu .