logo-tworzenie-stron-legnica

config

Strona w trakcie modernizacji

Zapraszamy wkrótce

Elementy (tagi, znaczniki) HTML
Tag (znacznik) input

 

Definicja elementu (tagu), przeznaczenie i użycie input

Znacznik input określa pole wejściowe, w którym użytkownik może wprowadzić dane. Element input jest najistotniejszym elementem formularza.

Znacznik input można wyświetlać na kilka sposobów, w zależności od atrybutu typu.

Różne typy wejść są następujące:

  • input type="text" (wartość domyślna)
  • input type="button"
  • input type="checkbox"
  • input type="color"
  • input type="date"
  • input type="datetime-local"
  • input type="email"
  • input type="file"
  • input type="hidden"
  • input type="image"
  • input type="month"
  • input type="number"
  • input type="password"
  • input type="radio"
  • input type="range"
  • input type="reset"
  • input type="search"
  • input type="submit"
  • input type="tel"
  • input type="time"
  • input type="url"
  • input type="week"

Wskazówka: zawsze używaj tagu label do definiowania etykiet dla input type="text", input type="checkbox", input type="radio", input type="file" i input type="password"

 

Atrybuty globalne

Tag input obsługuje również atrybuty globalne w HTML.

 

Atrybuty elementu (tagu) area

Atrybut Wartość Opis
accept file_extension
audio/*
video/*
image/*
media_type
Definiuje filtr dla typów plików, które użytkownik ma możliwość wybrać z okna dialogowego wprowadzania plików (tylko dla type="file").
alt text Definiuje alternatywny tekst dla obrazów (tylko dla type="image").
autocomplete on
off
Definiuje, czy element input powinien mieć włączone autouzupełnianie.
autofocus autofocus Definiuje, że element input powinien w sposób automatyczny uzyskać fokus podczas ładowania strony.
checked checked Definiuje, że element input ma być wstępnie wybrany podczas ładowania strony (dla type="checkbox" lub type="radio").
dirname inputname.dir Definiuje, że kierunek tekstu zostanie przesłany.
disabled disabled Definiuje, że element input powinien być wyłączony.
form form_id Definiuje formularz, do którego należy element input.
formaction URL Definiuje adres URL pliku, który będzie przetwarzał kontrolkę wejściową po przesłaniu formularza (dla type="submit" i type="image").
formenctype application/x-www-form-urlencoded
multipart/form-data
text/plain
Definiuje sposób kodowania danych formularza podczas przesyłania ich na serwer (dla type="submit" i type="image").
formmethod get
post
Definiuje metodę HTTP do wysyłania danych do adresu URL akcji (dla type="submit" i type="image").
formnovalidate formnovalidate Definiuje, że elementy formularza nie powinny być sprawdzane po przesłaniu.
formtarget _blank
_self
_parent
_top
framename
Definiuje, gdzie wyświetlić odpowiedź otrzymaną po przesłaniu formularza (dla type="submit" i type="image").
height pixels Definiuje wysokość elementu input (tylko dla type="image").
list datalist_id Wskazuje element datalist, który zawiera wstępnie zdefiniowane opcje dla elementu input.
max number
date
Definiuje maksymalną wartość elementu input.
maxlength number Definiuje maksymalną liczbę znaków dozwoloną w elemencie input.
min number
date
Definiuje minimalną wartość dla elementu input.
minlength number Definiuje minimalną liczbę znaków wymaganych w elemencie input.
multiple multiple Definiuje, że użytkownik ma możliwość wprowadzenia więcej niż jedną wartość w elemencie input.
name text Definiuje nazwę elementu input.
pattern regexp Definiuje wyrażenie regularne, względem którego sprawdzana jest wartość elementu input.
placeholder text Definiuje krótką wskazówkę opisującą oczekiwaną wartość elementu input.
readonly readonly Definiuje, że pole wejściowe jest tylko do odczytu.
required required Definiuje, że przed przesłaniem formularza należy wypełnić obowiązkowo te pole wejściowe.
size number Definiuje szerokość w znakach elementu input.
src URL Definiuje adres URL obrazu, który ma być używany jako przycisk przesyłania (tylko dla type="image").
step number
any
Definiuje odstęp między liczbami prawnymi w polu wejściowym.
type button
checkbox
color
date
datetime-local
email
file
hidden
image
month
number
password
radio
range
reset
search
submit
tel
text
time
url
week
Definiuje typ elementu input do wyświetlenia.
value text Definiuje wartość elementu input.
width pixels Definiuje szerokość elementu input (tylko dla type="image").

 

Wsparcie przeglądarek dla elementu (tagu) input

Element (tag) chrome edge firefox safari opera
input Tak Tak Tak Tak Tak

 

Przykładowe zastosowania elementu (tagu) input

 

Przykład elementu input

Formularz HTML z trzema polami wejściowymi; dwa pola tekstowe i jeden przycisk przesyłania:





Witold Czuba Tworzenie stron Warszawa, Wrocław i Legnica | Grafik | Strony , , Marynarska 54, 59-220, Legnica, dolnośląskie, Polska, tel. +48 780 060 995, Pon. - pt. 8:00 - 17:00

 

 

Witold Czuba

Tworzenie stron Warszawa, Wrocław i Legnica | Grafik | Strony

Marynarska 54
59-220, Legnica,
dolnośląskie, Polska,
tel. +48 780 060 995,
Pon. - pt. 8:00 - 17:00