Etykiety pól
Część sekcji Podstawy ścieżki HTML w Coddy. Lekcja 39 z 60.
Bez etykiety nie zawsze jest jasne, czego dotyczy pole wejściowe. Etykieta daje użytkownikom wyraźną wskazówkę wizualną, jakiego rodzaju danych oczekuje się w danym polu. Etykiety tworzy się za pomocą tagu <label>.
Oto podstawowa składnia:
<label for="field">Label text</label>
<input type="text" id="field"><label>: Tag, który tworzy etykietę.
for: Powiązanie etykiety z polem formularza. Wartośćforpowinna być zgodna z wartościąidpola formularza.
- Tekst etykiety: tekst opisujący, do czego służy pole formularza.
<input>: Pole formularza, do którego odnosi się etykieta.
id: Unikalny identyfikator pola formularza, który odpowiada atrybutowiforw etykiecie.
Po połączeniu kliknięcie tekstu etykiety umieszcza kursor w polu wejściowym (ustawia na nim fokus), dzięki czemu użytkownicy mają większy obszar do kliknięcia.
Wyzwanie
ŁatwyDodaj następujące tagi wewnątrz tagu <form>:
- Tag
<label>z tekstem 'First Name:' i atrybutemforustawionym na 'firstname'. - Pole
<input>ztype="text". - Pole
<input>powinno miećidzgodne z atrybutemforetykiety.
Spróbuj swoich sił
<!DOCTYPE html>
<html>
<body>
<form>
<!-- Wpisz tutaj kod -->
</form>
</body>
</html>
Sprawdź sięTa lekcja zawiera krótki quiz. Zacznij lekcję, żeby na niego odpowiedzieć i śledzić swoje postępy.
Wszystkie lekcje w sekcji Podstawy
1Podstawy HTML
Czym jest HTML?Podstawowa struktura dokumentu HTMLTagi i elementyZagnieżdżanie i zamykanie tagówKomentarze w HTML7Strona profilu osobistego
Omówienie projektuSekcja nagłówka
Zdjęcie profiloweSekcja „O mnie”Linki do mediów społecznościowych2Tekst i formatowanie
NagłówkiAkapityPodziały wierszaTekst pogrubiony i pochylonyPonownie: tekst pogrubiony i pochylonyPodsumowanie — formatowanie8Formularze i pola wejściowe, część 1
Podstawy formularzyPola tekstoweAtrybuty pólPole hasłaEtykiety pólPodsumowanie – podstawowy formularz11Strona rejestracji na wydarzenie
Przegląd projektuSekcja nagłówkaSekcja szczegółów wydarzeniaFormularz rejestracyjnySekcja stopkiPoćwicz samodzielnie: Edytor online Web