Kwalifikacje w Zawodzie - Testy zawodowe online | Egzaminy Zawodowe

KWALIFIKACJA INF3 - CZERWIEC 2023 (test 2)



PYTANIE NR 29.
W języku HTML zapisano formularz. Który z efektów działania kodu będzie wyświetlony przez przeglądarkę zakładając, że w pierwsze pole użytkownik przeglądarki wpisał wartość "Przykładowy tekst"?
Ilustracja przedstawia fragment kodu HTML oraz cztery różne efekty jego działania w przeglądarce.
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
<textarea> renderuje wielowierszowe pole tekstowe (tu o wysokości 3 wierszy), a <input type="checkbox"> daje kwadratowe pola wyboru, które można zaznaczać niezależnie. Spośród pokazanych wyników tylko "Efekt 2" przedstawia jednocześnie duże pole wielowierszowe oraz dwa checkboxy (a nie przyciski radio).

Pełne wyjaśnienie:

W formularzach HTML wygląd kontrolki w przeglądarce wynika przede wszystkim z użytego elementu i jego atrybutów. W tym zadaniu kluczowe są dwa typy pól:

  • <textarea> – zawsze tworzy wielowierszowe pole do wpisywania dłuższego tekstu. Atrybuty rows i cols wpływają na domyślny rozmiar (odpowiednio: przybliżona liczba widocznych wierszy i szerokość w znakach), ale nie zmieniają faktu, że jest to pole wielowierszowe.
  • <input type="checkbox"> – tworzy kwadratowe pole wyboru (checkbox). Każdy checkbox działa niezależnie: użytkownik może zaznaczyć zero, jeden albo wszystkie.

Dlatego poprawny wynik renderowania musi pokazywać: (1) duże, wielowierszowe pole tekstowe oraz (2) dwa kwadratowe checkboxy opisane etykietami (np. "Opcja1", "Opcja2"). To odpowiada "Efektowi 2".

Dlaczego pozostałe efekty są błędne?

  • Efekt 1 pokazuje przyciski opcji (radio) – są zwykle okrągłe i służą do wyboru jednej opcji w grupie, więc nie odpowiadają type="checkbox".
  • Efekt 3 przedstawia jednowierszowe pole tekstowe (typowe dla <input type="text">) zamiast wielowierszowego <textarea>.
  • Efekt 4 łączy dwa błędy: małe (jednowierszowe) pole oraz przyciski radio zamiast checkboxów.

Wskazówka egzaminacyjna: jeśli widzisz w kodzie <textarea>, szukaj w odpowiedziach prostokątnego pola na kilka linii; jeśli widzisz <input type="checkbox">, szukaj kwadratowych "okienek" wyboru (nie kółek).

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Co to jest <textarea> w HTML i do czego służy?
<textarea> to element formularza HTML służący do wprowadzania dłuższego, wielowierszowego tekstu (np. komentarz, opis, wiadomość). W przeciwieństwie do <input type="text"> nie jest ograniczony do jednej linii i zwykle ma większy prostokątny obszar edycji.
Jak działa atrybut rows i cols w <textarea>?
Atrybut rows określa przybliżoną liczbę widocznych wierszy, a cols – przybliżoną szerokość w znakach. Zmieniają one domyślny rozmiar pola, ale nie zmieniają typu kontrolki: <textarea> nadal pozostaje polem wielowierszowym, niezależnie od wartości tych atrybutów.
Co oznacza <input type="checkbox"> i jak wygląda w przeglądarce?
<input type="checkbox"> tworzy checkbox, czyli małe kwadratowe pole wyboru. Po kliknięciu zmienia stan zaznaczenia (zwykle pojawia się "ptaszek"). Każdy checkbox jest niezależny, więc użytkownik może zaznaczyć kilka opcji jednocześnie.
Jaka jest różnica między checkbox a radio button w HTML?
Checkbox (type="checkbox") służy do wyboru wielu niezależnych opcji naraz. Radio button (type="radio") służy do wyboru jednej opcji w grupie (elementy z tym samym atrybutem name są wzajemnie wykluczające). Wizualnie checkboxy są zwykle kwadratowe, a radio – okrągłe.
Dlaczego wpisany tekst w polu formularza jest widoczny w efekcie renderowania?
W zadaniach egzaminacyjnych często zakłada się, że użytkownik wpisał już wartość do pola, aby ocenić, które pole ją przechowuje i jak jest wyświetlana. Tekst pojawi się wewnątrz kontrolki edycyjnej (np. w <textarea>), a nie jako etykieta obok, jeśli nie użyto osobnego elementu opisującego.
Czy <textarea> może działać jak pole jednowierszowe?
Domyślnie <textarea> jest wielowierszowe. Można je stylować CSS (np. ograniczyć wysokość), ale semantycznie nadal jest to kontrolka do tekstu wielowierszowego. Jeśli potrzebujesz pola jednowierszowego, standardowym wyborem jest <input type="text">, które od razu renderuje się jako pojedyncza linia.
Jakie są najczęstsze błędy przy rozpoznawaniu elementów formularzy na egzaminie?
Najczęściej myli się checkbox z radio (bo oba służą do wyboru opcji) oraz <textarea> z <input type="text"> (bo oba przyjmują tekst). Pomaga zapamiętać: textarea = "większy prostokąt na kilka linii", checkbox = "kwadrat do zaznaczania", radio = "kółko – jedna opcja w grupie".
Jak sprawdzić w praktyce, jak przeglądarka renderuje <textarea> i checkboxy?
Najprościej utworzyć plik .html, wkleić minimalny formularz z <textarea> i <input type="checkbox">, a potem otworzyć go w przeglądarce. Warto porównać wygląd w dwóch przeglądarkach i pamiętać, że detale stylu mogą się różnić, ale typ kontrolki (wielowierszowe vs checkbox) pozostaje taki sam.
Kiedy stosuje się checkboxy zamiast listy rozwijanej?
Checkboxy stosuje się, gdy użytkownik ma możliwość zaznaczenia wielu opcji naraz i liczba opcji jest niewielka (np. zgody, preferencje, filtry). Lista rozwijana bywa wygodniejsza przy długich listach, ale przy wielokrotnym wyborze wymaga dodatkowych ustawień (np. multiple) i bywa mniej czytelna niż zestaw checkboxów.
Jakie są wskazówki, aby szybko rozwiązać takie zadanie z HTML na INF.3?
Najpierw wypisz elementy z kodu: czy jest <textarea> czy <input>, a jeśli <input> to jaki ma type. Potem dopasuj do obrazu: textarea = wielowierszowy prostokąt; checkbox = kwadrat; radio = kółko. Na końcu sprawdź, czy liczba kontrolek i podpisy opcji zgadzają się z kodem.
info

Statystycznie 57% uczniów zna prawidłową odpowiedź. średnie

Według specjalistów z branży: "&lt;textarea&gt; renderuje wielowierszowe pole tekstowe (tu o wysokości 3 wierszy), a &lt;input type=&quot;checkbox&quot;&gt; daje kwadratowe pola wyboru, które można zaznaczać niezależnie."

Źródła:

  • WHATWG HTML Living Standard – The textarea element: https://html.spec.whatwg.org/multipage/form-elements.html#the-textarea-element (dostęp: 2026-02-18)
  • WHATWG HTML Living Standard – Checkbox state (type=checkbox): https://html.spec.whatwg.org/multipage/input.html#checkbox-state-(type=checkbox) (dostęp: 2026-02-18)
  • MDN Web Docs – &lt;textarea&gt;: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea (dostęp: 2026-02-18)

Materiały:

  • Dokumentacja WHATWG HTML – sekcje: textarea oraz input type=checkbox
  • MDN Web Docs: HTML &lt;textarea&gt; oraz &lt;input type=&quot;checkbox&quot;&gt;
  • Ćwiczenia praktyczne: zbudowanie prostego formularza i obserwacja renderowania w przeglądarce
Zobacz też:

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego