Wyniki egzaminu

Nowy egzamin

Informacje o egzaminie:

Zawód: Technik informatyk
Kwalifikacja: INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych
Data rozpoczęcia: 17 czerwca 2026 07:07
Data zakończenia: 17 czerwca 2026 07:26

Egzamin zdany!

Wynik: 37/40 punktów (92,5%)

Wymagane minimum: 20 punktów (50%)

Nowe

Analiza przebiegu egzaminu- sprawdź jak rozwiązywałeś pytania

Przebieg egzaminu

Pochwal się swoim wynikiem!

Facebook

X.com

Szczegółowe wyniki:

Pytanie 1

Która praktyka ZWIĘKSZA czytelność kodu źródłowego?

A. pisanie jak najdłuższych linii w jednym wierszu

B. stosowanie wcięć i opisowych nazw zmiennych

C. unikanie jakichkolwiek komentarzy

D. nadawanie zmiennym jednoliterowych nazw

Czytelność kodu najbardziej poprawiają WCIĘCIA (pokazujące strukturę bloków) oraz OPISOWE nazwy zmiennych i funkcji, z których od razu wynika ich rola. Dzięki temu kod łatwiej zrozumieć i utrzymać. Dlatego czytelność zwiększa stosowanie wcięć i opisowych nazw.

Pytanie 2

Najłatwiejszym sposobem na zmianę obiektu z numerem 1 na obiekt z numerem 2 jest

A. zmiana warstwy obiektu

B. geometriczne przekształcenie obiektu

C. animacja obiektu

D. narysowanie obiektu docelowego

Geometryczne transformowanie obiektu to proces, który pozwala na zmiany w wielkości, kształcie, pozycji lub orientacji obiektu bez modyfikacji jego struktury. W przypadku zamiany obiektu oznaczonego cyfrą 1 na obiekt oznaczony cyfrą 2, transformacja geometryczna, jak skalowanie, jest najprostszą metodą. Skalowanie pozwala na proporcjonalne powiększenie obiektu, co jest niezbędne, gdy chcemy zwiększyć jego rozmiar bez zniekształceń. W praktyce, narzędzia do obróbki grafiki czy modelowania 3D, takie jak Adobe Illustrator czy AutoCAD, oferują funkcje do precyzyjnego skalowania. Kluczowe jest zachowanie proporcji, co można osiągnąć poprzez skalowanie względem określonego punktu odniesienia. Transformacje geometryczne są fundamentalne w wielu dziedzinach, takich jak projektowanie graficzne, inżynieria czy animacja komputerowa, i są zgodne z najlepszymi praktykami, które promują efektywność i precyzję w pracy z obiektami wizualnymi.

Pytanie 3

Termin "front-end" w kontekście projektowania stron WWW odnosi się do

A. organizacji informacji na serwerze WWW

B. działania skryptów oraz aplikacji realizowanych po stronie serwera WWW

C. bazy danych z danymi publikowanymi na stronie

D. interfejsu witryny internetowej powiązanego z technologiami operującymi w przeglądarce internetowej

Front-end to wszystko to, co widzisz w przeglądarce, czyli ogólnie mówiąc, wygląd strony i to, jak się z nią bawisz. Mówię tu o kolorach, czcionkach, układzie czy różnych akcjach, które możesz wykonać. Technologie jak HTML, CSS i JavaScript są tu na czołowej pozycji, bo to dzięki nim strona jest taka interaktywna i przyjemna dla oka. Przykłady? Budowa responsywnych interfejsów, które zmieniają rozmiar na różnych ekranach, albo skrypty, które potrafią zmieniać treści na stronie bez przeładowania jej. Dobrze jest też pomyśleć o tym, żeby strona ładowała się jak najszybciej, bo to wpływa na to, jak użytkownicy będą ją odbierać. A jeśli znasz nowe frameworki, jak React czy Angular, to naprawdę ułatwia stworzenie bardziej złożonych aplikacji webowych, co w dzisiejszych czasach jest mega ważne.

Pytanie 4

Jak określa się proces przedstawiania informacji zawartych w dokumencie elektronicznym w formie odpowiedniej dla konkretnego środowiska?

A. Teksturowanie

B. Mapowanie

C. Renderowanie

D. Rasteryzacja

Renderowanie to proces, w którym dane zawarte w dokumencie elektronicznym są przekształcane w formę wizualną, która jest zrozumiała dla użytkownika. W praktyce oznacza to przekształcenie informacji na ekranie w sposób odpowiedni do kontekstu, w jakim są prezentowane. Renderowanie jest kluczowe w takich technologiach jak HTML, CSS oraz JavaScript, gdzie przetwarzane są dokumenty webowe, a ich wygląd oraz interaktywność są dostosowywane do możliwości przeglądarek. Przykładem zastosowania renderowania może być proces wyświetlania stron internetowych, gdzie przeglądarka interpretując kod HTML, CSS i JavaScript, renderuje dynamiczne treści, obrazy oraz elementy interaktywne. Rekomendowane praktyki branżowe dotyczące renderowania obejmują optymalizację czasu ładowania stron poprzez techniki, takie jak lazy loading, a także zapewnienie dostępności poprzez poprawne użycie znaczników semantycznych. W kontekście grafiki komputerowej, renderowanie jest również używane do generowania obrazów z modeli 3D, gdzie zaawansowane algorytmy renderujące tworzą realistyczne obrazy w grach komputerowych czy symulacjach wizualnych. Zrozumienie procesu renderowania jest kluczowe dla twórców treści cyfrowych, programistów oraz specjalistów od UX/UI.

Pytanie 5

Który format to RASTROWY format graficzny z kompresją BEZSTRATNĄ?

A. PNG

B. SVG

C. JNG

D. CDR

PNG to rastrowy format graficzny z kompresją BEZSTRATNĄ - zmniejsza rozmiar pliku bez pogorszenia jakości obrazu, dodatkowo obsługując przezroczystość. Dlatego nadaje się do grafik, w których liczy się czystość krawędzi i kolorów. Zapamiętaj: PNG = raster + bezstratność (+ kanał alfa).

Pytanie 6

W skrypcie JavaScript użyto metody DOM getElementsByClassName('akapit'). Ta metoda odniesie się do akapitu

A. <p>akapit</p>

B. <p href="/akapit">akapit3</p>

C. <p id="akapit">akapit2</p>

D. <p class="akapit">akapit4</p>

Metoda DOM getElementsByClassName jest jedną z najważniejszych funkcji w JavaScript, która pozwala na selekcję elementów na stronie internetowej na podstawie ich klas CSS. W tym przypadku, odpowiedź <p class="akapit">akapit4</p> jest poprawna, ponieważ element ten ma przypisaną klasę "akapit", co czyni go bezpośrednim kandydatem do selekcji przez metodę getElementsByClassName('akapit'). Metoda ta zwraca kolekcję elementów (HTMLCollection), które mają podaną klasę, a następnie można z nimi pracować w kodzie JavaScript. Na przykład, możemy zmieniać ich style, zawartość lub dodawać zdarzenia. Dobrą praktyką jest stosowanie klas do stylizacji oraz manipulacji DOM, co pozwala na lepszą organizację kodu i zwiększa jego czytelność. Pamiętaj, że klasy są bardziej uniwersalne i elastyczne niż identyfikatory (ID), które powinny być unikalne na stronie. W przypadku konieczności stosowania metod do manipulacji elementami DOM, warto znać również inne metody, takie jak querySelector i querySelectorAll, które oferują bardziej zaawansowane opcje selekcji, umożliwiające wykorzystanie kombinacji klas, identyfikatorów i innych atrybutów.

Pytanie 7

Znacznik <pre> </pre> służy do wyświetlania

A. treści czcionką w języku polskim

B. znaku wielokropkowego

C. treści czcionką o stałej szerokości

D. znaku skreślenia

Znacznik <pre> </pre> jest używany do wyświetlania treści w formacie, który zachowuje oryginalny układ oraz czcionkę o stałej szerokości. Umożliwia on prezentację tekstu w takiej formie, w jakiej został wprowadzony, co jest szczególnie przydatne w kontekście kodu źródłowego, danych tabelarycznych lub innych elementów, gdzie zachowanie spacji, łamań linii i innych formatów jest istotne. Przykładem zastosowania znacznika <pre> może być wyświetlanie fragmentów kodu w dokumentacji HTML lub na stronach internetowych, gdzie istotne jest, aby użytkownik mógł widzieć dokładnie, jak kod wygląda, bez modyfikacji przestrzeni lub układu, co jest często problematyczne w przypadku standardowego tekstu HTML. Używanie tego znacznika jest zgodne z dobrymi praktykami w tworzeniu przejrzystych i czytelnych interfejsów, zwłaszcza w kontekście tworzenia stron internetowych o charakterze technicznym.

Pytanie 8

Aby zdefiniować styl akapitu <p>, który występuje bezpośrednio po znaczniku <img>, należy w arkuszu CSS zastosować selektor:

img > p

img [p]

img + p

img p

Te selektory różnią się rodzajem powiązania między elementami. img p ze spacją to selektor potomka - odnosi się do akapitów znajdujących się wewnątrz obrazu, co jest niemożliwe, bo <img> nie zawiera treści. img > p z operatorem > wybiera bezpośrednie dzieci elementu, więc również szuka <p> w środku <img>. Zapis img [p] jest po prostu błędny - nawiasy kwadratowe w CSS służą do dopasowania po atrybutach, a nie po nazwie znacznika. Akapit stojący tuż za obrazem, jako jego sąsiad, wskazuje selektor img + p z operatorem sąsiedztwa.

Pytanie 9

Przedstawiony serwis internetowy służy do walidacji

A. dokumentów HTML.

B. arkuszy stylów.

C. bazy danych SQL.

D. skryptów JavaScript.

Twoja odpowiedź jest prawidłowa. Strona internetowa 'CSS Validation Service' jest narzędziem stworzonym przez konsorcjum W3C do walidacji arkuszy stylów CSS. W3C, czyli World Wide Web Consortium, to międzynarodowa społeczność, która rozwija otwarte standardy mające na celu długoterminowe wzrost i rozwój sieci WWW. Narzędzie do walidacji CSS zapewnia mechanizm sprawdzania kodu CSS pod kątem zgodności ze standardami W3C. Dzięki temu deweloperzy mogą upewnić się, że ich arkusze stylów są poprawne, co jest kluczowe dla zapewnienia prawidłowego wyglądu i działania stron internetowych na różnych platformach i przeglądarkach. Walidator CSS pomaga także naprawić ewentualne błędy w kodzie. To jest praktyczne zastosowanie tej usługi - utrzymanie jednolitych standardów kodowania, co prowadzi do większej interoperacyjności pomiędzy różnymi technologiami i narzędziami.

Pytanie 10

Przy konwersji obrazu z 8-bitowej głębi kolorów na 4-bitową, liczba dostępnych kolorów zmniejszy się o:

A. 256

B. 240

C. 24

D. 16

Głębia n-bitowa daje 2 do potęgi n kolorów: 8 bitów to 256 kolorów, a 4 bity to 16 kolorów. Po konwersji liczba dostępnych kolorów spada o 256 - 16 = 240. Dlatego liczba kolorów zmniejszy się o 240.

Pytanie 11

Język HTML oferuje nagłówki, które służą do tworzenia hierarchii zawartości. Te nagłówki występują wyłącznie w zakresie

A. h1 - h8

B. h1 - h6

C. h1 - h4

D. h1 - h10

Odpowiedź h1 - h6 jest poprawna, ponieważ w języku HTML nagłówki są definiowane w ramach sześciu poziomów, od h1 do h6. Nagłówki te pełnią kluczową rolę w organizacji treści na stronie internetowej, umożliwiając tworzenie hierarchii oraz struktury dokumentu. h1 jest najważniejszym nagłówkiem i powinien być używany do oznaczania głównego tytułu strony, podczas gdy h2, h3, h4, h5 i h6 służą do tworzenia podtytułów i hierarchii treści w miarę potrzeby. Na przykład, nagłówek h2 może być użyty do oznaczenia sekcji podrzędnej w stosunku do h1, a h3 do następnej sekcji podrzędnej. Takie zrozumienie hierarchii nagłówków jest istotne z punktu widzenia SEO, ponieważ wyszukiwarki korzystają z tych struktur do indeksowania treści. Dobrze zorganizowane nagłówki poprawiają również dostępność strony, co jest zgodne z najlepszymi praktykami webowymi, a także ułatwiają nawigację użytkownikom, zarówno ludziom, jak i robotom wyszukiwarek.

Pytanie 12

Który atrybut <img> trzeba uzupełnić, aby strona była dostępna dla osób NIEWIDOMYCH?

style

text

src

alt

Atrybut alt znacznika <img> zawiera tekst alternatywny opisujący obraz. Czytniki ekranu odczytują go osobom niewidomym, dzięki czemu wiedzą one, co przedstawia grafika - to fundament dostępności (a11y), a także wartość dla SEO. Dlatego uzupełnić trzeba atrybut alt.

Pytanie 13

Efekt przedstawiony w filmie powinien być zdefiniowany w selektorze

A. tr:active { background-color: Pink; }

B. tr { background-color: Pink; }

C. td, th { background-color: Pink; }

D. tr:hover { background-color: Pink; }

Poprawny selektor to tr:hover { background-color: Pink; }, bo dokładnie opisuje sytuację pokazaną na filmie: efekt pojawia się dopiero po najechaniu kursorem na cały wiersz tabeli. Pseudo-klasa :hover w CSS służy właśnie do definiowania stylów w momencie, gdy użytkownik „najeżdża” myszką na dany element. Jeśli więc chcemy, żeby podświetlał się cały rząd tabeli, logiczne i zgodne z dobrymi praktykami jest przypięcie efektu do znacznika tr, a nie do pojedynczych komórek.

W praktyce taki zapis stosuje się bardzo często w interfejsach webowych: w panelach administracyjnych, listach zamówień, tabelach z uczniami, produktami, logami systemowymi itd. Dzięki temu użytkownik łatwiej śledzi, który wiersz właśnie ogląda. To niby detal, ale z punktu widzenia UX robi sporą różnicę. Z mojego doświadczenia to jeden z tych prostych trików CSS, które od razu poprawiają „odczuwalną” jakość strony.

Ważne jest też to, że :hover jest częścią standardu CSS (opisane m.in. w specyfikacji CSS Selectors Level 3/4) i działa w praktycznie wszystkich współczesnych przeglądarkach. Nie trzeba do tego żadnego JavaScriptu, żadnych skomplikowanych skryptów – czysty CSS. Dobrą praktyką jest również używanie bardziej stonowanych kolorów niż Pink w prawdziwych projektach, np. #f5f5f5 albo lekki odcień niebieskiego, tak żeby kontrast był czytelny i nie męczył wzroku. Warto też pamiętać, że podobny mechanizm możesz zastosować na innych elementach: np. a:hover dla linków, button:hover dla przycisków czy nawet div:hover dla całych kafelków w layoutach. Kluczowe jest to, żeby pseudo-klasa :hover była przypięta dokładnie do tego elementu, który ma reagować na interakcję użytkownika.

Pytanie 14

Czym jest DBMS?

A. kaskadowym arkuszem stylów do opisu wyglądu strony

B. obiektowym językiem programowania do tworzenia stron

C. strukturalnym językiem zapytań do bazy danych

D. systemem zarządzania bazą danych

DBMS (Database Management System) to system zarządzania bazą danych - oprogramowanie, które przechowuje dane, udostępnia je wielu użytkownikom, kontroluje dostęp i wykonuje zapytania (np. SQL). Przykłady to MySQL, MariaDB, PostgreSQL czy MS SQL Server. Dlatego DBMS to system zarządzania bazą danych.

Pytanie 15

W języku CSS wprowadzono poniższe formatowanie:

p > i { color: blue; }

Oznacza to, że tekst w kolorze niebieskim będzie zapisany:

A. pochylony tekst akapitu

B. cały tekst akapitu, bez względu na jego formatowanie

C. pogrubiony tekst akapitu

D. cały tekst nagłówków, bez względu na ich formatowanie

W języku CSS selektor > jest używany do stylizowania bezpośrednich potomków danego elementu. W podanym przykładzie p > i oznacza, że reguła CSS będzie zastosowana do elementu i będącego bezpośrednim dzieckiem elementu p. To oznacza, że tylko tekst zapisany w tagu i wewnątrz paragrafu p będzie miał kolor niebieski. Jest to powszechnie stosowane podejście do precyzyjnego stylizowania elementów na stronach internetowych, z zachowaniem struktury dokumentu HTML. Takie rozwiązanie pozwala na lepszą kontrolę nad wyglądem i prezentacją dokumentu, co jest istotne przy tworzeniu responsywnych i estetycznych stron. Praktyczne zastosowanie tego stylu można zobaczyć w przypadku, gdy chcemy wyróżnić pewne frazy w paragrafie, na przykład cytaty lub terminy. Warto pamiętać, że używanie selektorów potomstwa poprawia czytelność i efektywność kodu CSS, co jest dobrą praktyką w profesjonalnym kodowaniu frontendowym. Zachowanie spójności i przejrzystości stylów jest kluczowe w większych projektach, gdzie wiele osób pracuje nad kodem.

Pytanie 16

W dokumencie HTML utworzono formularz wysyłający dane do skryptu formularz.php. Po naciśnięciu przycisku typu submit, przeglądarka przekierowuje nas do określonego adresu. Na podstawie podanego linku można wywnioskować, że dane do pliku formularz.php przesłano metodą

.../formularz.php?imie=Anna&nazwisko=Kowalska

A. GET

B. POST

C. COOKIE

D. SESSION

Metoda GET w HTTP jest używana do przesyłania danych w adresie URL. Dane są dołączane jako parametry zapytania po znaku zapytania w formacie klucz=wartość. Przykład w pytaniu pokazuje, że dane imie=Anna oraz nazwisko=Kowalska są przesyłane jako część adresu URL do formularz.php. Jest to typowe dla metody GET, która umożliwia łatwe przesyłanie danych przez przeglądarkę i ich późniejsze przetwarzanie po stronie serwera. Metoda GET jest często stosowana w przypadku, gdy dane nie zawierają poufnych informacji, a ich objętość jest niewielka. Standard HTTP rekomenduje używanie metody GET do pobierania danych i niepowinno być używane do przesyłania lub modyfikowania danych. Dokumentacja W3C wskazuje, że GET jest metodą idempotentną, co oznacza, że wielokrotne wykonanie tego samego zapytania nie spowoduje dodatkowych efektów ubocznych. W praktyce GET jest używana np. w zapytaniach wyszukiwania w witrynach, gdzie parametry wyszukiwania są umieszczane w URL.

Pytanie 17

W języku JavaScript funkcja getElementById odnosi się do

A. klasy zdefiniowanej w CSS

B. elementu HTML z określoną nazwą klasy

C. zmiennej numerycznej

D. elementu HTML z podanym id

Metoda getElementById w języku JavaScript jest kluczowym narzędziem do manipulacji DOM (Document Object Model), które pozwala deweloperom na łatwe odwoływanie się do konkretnych elementów HTML za pomocą ich atrybutu id. Dzięki temu, możemy dynamicznie zmieniać treść, style lub atrybuty tych elementów, co jest niezwykle przydatne w tworzeniu interaktywnych stron internetowych. Na przykład, jeśli mamy element HTML z atrybutem id='header', możemy użyć `document.getElementById('header')` do uzyskania do niego dostępu. To podejście jest zgodne z zasadami poprawnej struktury HTML, gdzie atrybut id powinien być unikalny w obrębie dokumentu. Rekomendowane jest, aby id było zrozumiałe i jasno określało zawartość elementu, co ułatwia późniejszą nawigację i skrypty, a także poprawia dostępność strony. W praktyce, korzystając z getElementById, możemy na przykład zmieniać tekst nagłówka: `document.getElementById('header').innerText = 'Nowy nagłówek';`.

Pytanie 18

Który z poniższych kodów HTML odpowiada przedstawionej tabeli? Dla uproszczenia pominięto zapis dotyczący stylu obramowania tabeli oraz komórek?

A. Rys. C

B. Rys. A

C. Rys. B

D. Rys. D

Poprawna odpowiedź to Rys. B ponieważ wykorzystuje atrybut rowspan="2" który łączy dwie komórki w pierwszej kolumnie w jeden wiersz Koncepcja rowspan umożliwia efektywne zarządzanie strukturą danych w tabeli HTML pozwalając na oszczędność miejsca i uniknięcie zduplikowanych komórek W praktyce rowspan jest niezwykle przydatny w projektach gdzie dane muszą być prezentowane w sposób zorganizowany i czytelny Dobre zrozumienie tego atrybutu jest kluczowe w tworzeniu responsywnych i estetycznych stron internetowych Zastosowanie rowspan zgodne jest ze standardami W3C co czyni kod bardziej zgodnym z wieloma przeglądarkami i urządzeniami Warto również pamiętać że prawidłowe użycie atrybutów takich jak rowspan poprawia dostępność strony co jest ważnym aspektem współczesnego projektowania stron internetowych Wiedza o tym jak zarządzać strukturą tabel i używać odpowiednich atrybutów wpływa na lepsze doświadczenie użytkownika Jest to również istotne w kontekście SEO gdyż poprawna semantyka HTML może wpłynąć na lepsze indeksowanie witryny przez wyszukiwarki

Pytanie 19

Na ilustracji przedstawiono ustawienia programu służącego do montażu filmów. Nowy projekt ma ustawienia

A. 48 minut czasu trwania filmu.

B. 25 klatek na cały film.

C. wysokość 1920 px i szerokość 1080 px.

D. 25 klatek na każdą sekundę filmu.

Prawidłowa odpowiedź wynika bezpośrednio z oznaczenia „25 fps” w ustawieniach projektu. Skrót fps oznacza „frames per second”, czyli liczbę klatek na sekundę. Jeśli projekt ma 25 fps, to znaczy, że każda sekunda gotowego filmu będzie złożona z 25 kolejnych klatek wideo. To jest właśnie standardowa liczba klatek na sekundę stosowana w Europie (standard telewizyjny oparty na PAL), bardzo często używana w programach do montażu i w kamerach.
W praktyce wygląda to tak: jeżeli nagrasz materiał w 25 fps i zmontujesz projekt również w 25 fps, to ruch będzie wyglądał naturalnie, a odtwarzanie będzie płynne i zgodne z typowymi ustawieniami telewizorów i wielu platform VOD. Gdybyś ustawił np. 10 fps, obraz byłby wyraźnie „szarpiący”, a przy 60 fps – bardzo płynny, ale też wymagający więcej miejsca na dysku i większej mocy obliczeniowej przy montażu.
Moim zdaniem warto zapamiętać, że liczba klatek na sekundę to jedna z kluczowych decyzji przy zakładaniu nowego projektu: wpływa na płynność ruchu, rozmiar pliku wynikowego i komfort montażu. W programach do edycji wideo zawsze szukaj parametru „Frame Rate” lub właśnie „fps”. Jeżeli widzisz tam liczbę, np. 24, 25, 30, 50 czy 60, to zawsze będzie chodziło o liczbę klatek przypadających na jedną sekundę odtwarzania filmu, a nie o całkowitą liczbę klatek czy czas trwania projektu. W tym zadaniu opis 25 fps dokładnie odpowiada odpowiedzi „25 klatek na każdą sekundę filmu”.

Pytanie 20

Która z list jest interpretacją podanego kodu?

A. Rys. D

B. Rys. A

C. Rys. C

D. Rys. B

Kod HTML zawiera uporządkowaną listę ol z dwoma głównymi elementami muzyka i filmy Każdy z tych elementów ma zagnieżdżoną listę nieuporządkowaną ul z odpowiednimi wpisami W HTML użycie listy ol oznacza że elementy główne będą numerowane Kolejność elementów w kodzie muzyka a następnie filmy jest zgodna z ilustracją C gdzie każdy element nadrzędny zawiera swoją własną zagnieżdżoną listę nieuporządkowaną ul Prawidłowe zagnieżdżanie list jest kluczowe dla struktury semantycznej dokumentu HTML co ma znaczenie dla SEO i dostępności Dobrym przykładem praktyki jest używanie odpowiednich znaczników aby zachować logiczną hierarchię Użycie ol i ul w odpowiednich miejscach pozwala na lepsze zrozumienie i interpretację treści przez przeglądarki i czytniki ekranowe Zapewnienie poprawnej struktury list pomaga również w utrzymaniu porządku w kodzie i lepszym zarządzaniu stylem za pomocą CSS

Pytanie 21

System baz danych gromadzi multimedia, co wiąże się z przechowywaniem znacznych ilości danych binarnych. Jakiego typu danych należy użyć w tym przypadku?

A. BLOB

B. LONGTEXT

C. DOUBLE

D. ENUM

Wybór innych typów danych, takich jak ENUM, DOUBLE czy LONGTEXT, do przechowywania danych multimedialnych jest nieodpowiedni z kilku powodów. ENUM jest typem danych służącym do przechowywania z góry zdefiniowanych wartości, co oznacza, że jego zastosowanie ogranicza się do małych zestawów danych, takich jak kategorie czy statusy, a nie do dużych, binarnych plików multimedialnych. Przykładowo, jeśli chcielibyśmy przechować obraz jako ENUM, napotkalibyśmy na problem z rozmiarem oraz elastycznością tego rozwiązania, co w praktyce byłoby nieefektywne. DOUBLE z kolei jest typem służącym do przechowywania liczb zmiennoprzecinkowych, co również nie ma zastosowania w kontekście danych binarnych, takich jak multimedia. Użycie DOUBLE do przechowywania plików audio czy wideo byłoby błędne, ponieważ nie jest on przystosowany do przechowywania danych binarnych, a jedynie do reprezentacji wartości numerycznych. LONGTEXT, mimo że może pomieścić dużą ilość danych tekstowych, również nie jest odpowiedni do przechowywania danych binarnych. Jest to typ przeznaczony do długich łańcuchów znaków, co nie pasuje do formatu plików multimedialnych, które wymagają innego podejścia. Użycie niewłaściwych typów danych w bazach danych może prowadzić do problemów z wydajnością, a także do trudności w zarządzaniu danymi. Dlatego ważne jest, aby dobrze rozumieć różnice między typami danych i ich zastosowaniem w praktyce, aby zapewnić optymalne przechowywanie i zarządzanie danymi w aplikacjach.

Pytanie 22

Jakie oznaczenie powinno się zastosować, aby umieścić film na stronie internetowej?

A. <movie>

B. <video>

C. <audio>

D. <media>

Znacznik <video> jest właściwym elementem HTML używanym do osadzania filmów na stronach internetowych. Jest on częścią standardu HTML5, który wprowadził nowoczesne podejścia do multimediów w sieci. Umożliwia on nie tylko osadzanie wideo, ale także dostosowywanie jego odtwarzania, takie jak automatyczne odtwarzanie, powtarzanie oraz kontrolowanie głośności. Przykład użycia znacznika <video>: <video src='film.mp4' controls>Odtwarzacz wideo</video>. Warto również dodać atrybuty, takie jak 'controls', które dodają przyciski do odtwarzania, pauzowania i regulacji głośności, co znacząco poprawia użyteczność dla użytkowników. Dobrą praktyką jest również używanie atrybutu 'poster' do określenia miniatury, która będzie wyświetlana przed rozpoczęciem odtwarzania, co przyciąga uwagę i zwiększa estetykę strony. Znacznik <video> wspiera różne formaty plików, takie jak MP4, WebM i Ogg, co zapewnia szeroką kompatybilność z różnymi przeglądarkami internetowymi, co jest kluczowe w dzisiejszym zróżnicowanym środowisku online.

Pytanie 23

Wskaż, które z poniższych zdań jest prawdziwe w odniesieniu do definicji stylu:

<STYLE type="text/css">
<!--
   P {color:blue; font-size:14pt; font-style:italic;}
   A {font-size:16pt; text-transform:lowercase;}
   TD.niebieski {color:blue}
   TD.czerwony {color:red}
-->
</STYLE>

A. Jest to styl zasięg lokalny

B. Zdefiniowano dwie klasy

C. Odnośnik będzie napisany czcionką o rozmiarze 14 punktów

D. Akapit będzie przekształcany na małe litery

Pierwsza odpowiedź sugeruje, że styl jest lokalny, ale tak naprawdę to nie jest do końca prawda. Definicje stylów w tym kodzie są globalne, więc nie możesz mówić o stylach lokalnych, które odnosiłyby się tylko do konkretnego elementu. Klasy w arkuszu stylów są dostępne w całym dokumencie, więc to są style globalne. Następna odpowiedź mówi, że akapit będzie transponowany na małe litery, co też nie jest prawdą, bo w CSS nie ma zdefiniowanej transformacji tekstu dla elementu P. Element A ma natomiast zastosowaną transformację, która zmienia tekst na małe litery, więc nie można tego przypisać do akapitu. Ostatnia błędna odpowiedź sugeruje, że odnośnik będzie miał czcionkę 14 punktów i to również jest mylne. W rzeczywistości odnośnik A ma czcionkę 16 punktów, co sprawia, że jest lepiej widoczny niż akapit. Wydaje mi się, że te błędne odpowiedzi wynikają z niepełnego zrozumienia, jak działają klasy CSS i jakie style można przypisać różnym elementom HTML.

Pytanie 24

W HTML informacje o autorze, streszczeniu oraz słowach kluczowych strony powinny być umieszczone

A. pomiędzy znacznikami <body> i </body>, w znaczniku <html>

B. pomiędzy znacznikami <head> i </head>, w znaczniku <style>

C. pomiędzy znacznikami <body> i </body>, w znaczniku <meta>

D. pomiędzy znacznikami <head> i </head>, w znaczniku <meta>

W HTML kluczowe informacje, takie jak autor, streszczenie i słowa kluczowe, powinny być umieszczone między znacznikami <head> i </head>. Te znaczniki <meta> są naprawdę ważne, bo to one informują przeglądarki i wyszukiwarki o tym, co jest w Twojej stronie. Na przykład, znaczniki <meta name="description" content="Opis strony"> oraz <meta name="keywords" content="słowo1, słowo2, słowo3">. Dzięki tym danym, wyszukiwarki lepiej rozumieją, o czym jest strona, co może wpłynąć na jej pozycję w wynikach wyszukiwania. Moim zdaniem, dobrze przemyślane opisy i słowa kluczowe to klucz do sukcesu, bo to one przyciągają użytkowników do kliknięcia w Twój link. Pamiętaj też, że znacznik <title> i inne meta tagi w <head> są mega istotne dla SEO. Informacje te tworzą podstawy Twojego dokumentu HTML, więc warto je dobrze wypełnić, żeby strona działała jak należy.

Pytanie 25

W trakcie weryfikacji stron internetowych nie analizuje się

A. zgodności z różnymi przeglądarkami

B. funkcjonowania linków

C. źródeł pochodzenia narzędzi edytorskich

D. błędów składniowych w kodzie

W procesie walidacji stron internetowych kluczowym celem jest upewnienie się, że kod HTML, CSS i inne zasoby są zgodne z obowiązującymi standardami W3C (World Wide Web Consortium). Walidacja skutecznie identyfikuje błędy składniowe, które mogą wpływać na renderowanie strony, analizuje działanie linków, a także sprawdza, jak strona zachowuje się w różnych przeglądarkach. Jednak aspekty związane z pochodzeniem narzędzi edytorskich nie są istotnym elementem tego procesu. Narzędzia edytorskie, takie jak edytory tekstowe czy IDE, są jedynie środkiem do tworzenia kodu, a ich źródło nie powinno wpływać na to, czy strona jest poprawnie zaimplementowana. Na przykład, strona może być poprawnie zwalidowana niezależnie od tego, czy została zbudowana w popularnym edytorze, takim jak Visual Studio Code, czy innym mniej znanym narzędziu. Dlatego koncentrowanie się na źródłach narzędzi edytorskich w kontekście walidacji byłoby nieuzasadnione i nieprzydatne.

Pytanie 26

Który z poniższych znaczników wchodzi w skład sekcji <head> dokumentu HTML?

A. <img>

B. <section>

C. <span>

D. <title>

<title> jest jednym z kluczowych znaczników w sekcji <head> dokumentu HTML. Odpowiada za definiowanie tytułu strony, który jest wyświetlany w pasku tytułu przeglądarki oraz w wynikach wyszukiwania. Tytuł jest istotnym elementem SEO, ponieważ informuje zarówno użytkowników, jak i wyszukiwarki o tematyce strony. Przykład użycia znacznika <title>: <head><title>Moja Strona Internetowa</title></head>. Należy pamiętać, że tytuł powinien być zwięzły, ale jednocześnie opisowy, zazwyczaj nie powinien przekraczać 60 znaków. W kontekście standardów, HTML5, który jest obecnie najnowszą wersją HTML, wciąż podkreśla znaczenie znacznika <title> jako fundamentalnego dla struktury dokumentu. Odpowiedni tytuł nie tylko poprawia doświadczenia użytkowników, ale również zwiększa widoczność strony w wynikach wyszukiwania, dlatego jego prawidłowe użycie ma kluczowe znaczenie w web designie i marketingu internetowym.

Pytanie 27

Dla strony internetowej stworzono grafikę rysunek.jpg o wymiarach: szerokość 200 px, wysokość 100 px. Jak można wyświetlić tę grafikę jako miniaturę – pomniejszoną z zachowaniem proporcji, używając znacznika?

A. <img src="rysunek.png">

B. <img src="rysunek.png" style="width: 25px; height:50px;">

C. <img src="rysunek.png" style="width: 25px; height:25px;">

D. <img src="rysunek.png" style="width: 50px">

No dobra, ta odpowiedź <img src="rysunek.png" style="width: 50px"> jest w porządku, bo ustawia szerokość grafiki na 50 pikseli. Dzięki temu zachowujemy proporcje oryginalnego rysunku, który ma rozmiar 200x100 pikseli. Jak zmniejszymy szerokość do 50 px, to automatycznie zmniejsza się też wysokość, więc dostajemy miniaturkę 50x25 px. To jest mega istotne, kiedy budujemy responsywne strony, które muszą się dobrze wyświetlać na różnych urządzeniach. Korzystanie z CSS do ogarniania wielkości obrazków to najlepsza praktyka w web devie, bo dzięki temu możemy elastycznie dopasować treści do różnych ekranów. No i nie zapominajmy o dostępności – zasady mówią, że zachowanie proporcji jest ważne, bo źle skompresowane lub rozciągnięte obrazy mogą sprawić problem osobom z ograniczeniami wzrokowymi.

Pytanie 28

Jakim systemem do zarządzania wersjami oprogramowania jest

A. GIT

B. Eclipse

C. TotalCommander

D. FileZilla

GIT to system kontroli wersji, który jest niezwykle popularny wśród programistów i zespołów developerskich, umożliwiający śledzenie zmian w kodzie źródłowym oraz współpracę nad projektami. GIT jest rozproszonym systemem, co oznacza, że każdy programista ma pełną kopię repozytorium na swoim lokalnym komputerze. Dzięki temu, praca w trybie offline jest możliwa, a zmiany można synchronizować później z centralnym repozytorium. GIT wspiera również wiele funkcji, takich jak branching, co pozwala na równoległe rozwijanie funkcjonalności bez wpływu na główną wersję kodu. Przykładowo, zespół może pracować nad nowymi funkcjami w osobnych gałęziach i łączyć je z główną wersją po zakończeniu prac. GIT jest również zgodny z najlepszymi praktykami, takimi jak Continuous Integration (CI) i Continuous Deployment (CD), co pozwala na automatyzację procesów testowania i wdrażania oprogramowania. W branży IT GIT stał się standardem, a jego znajomość jest kluczowa dla efektywnej pracy w zespołach. Warto również wspomnieć o platformach takich jak GitHub czy GitLab, które oferują zintegrowane narzędzia do zarządzania projektami opartymi na GIT.

Pytanie 29

Kolor określony kodem RGB, mający wartość rgb(255, 128, 16) w przedstawieniu szesnastkowym, przyjmie jaką wartość?

A. #008010

B. #ff0fl0

C. #ff8010

D. #ff8011

Odpowiedź #ff8010 jest trafna. Konwersja wartości RGB na szesnastkowy to w sumie przekształcanie kolorów: czerwony, zielony i niebieski. W przypadku rgb(255, 128, 16), czerwony (255) zmienia się w 'ff', zielony (128) w '80', a niebieski (16) w '10'. Gdy to wszystko połączymy, dostajemy kod #ff8010. To wiedza, która naprawdę się przydaje, gdy pracujesz z kolorami w stronach www, aplikacjach graficznych czy przy projektowaniu interfejsów. W branży IT używanie standardu RGB i konwersji do HEX to normalka, bo to pozwala na dokładne określenie kolorów w kodzie. Na przykład, w CSS łatwo będzie używać kolorów w tym formacie, a to pomaga w lepszej czytelności kodu.

Pytanie 30

W CSS zapis w postaci

 h1::first-letter {color: red;}

spowoduje, że kolor czerwony zostanie zastosowany do

A. pierwszej linii akapitu

B. pierwszej litery nagłówka w drugim stopniu

C. tekstu nagłówka w pierwszym stopniu

D. pierwszej litery nagłówka w pierwszym stopniu

Zapis <span>h1::first-letter {color: red;} </span> jest w porządku, bo korzysta z pseudoelementu :first-letter, który działa na pierwszą literkę w nagłówku h1. To całkiem fajne, bo możemy w ten sposób stylizować tę pierwszą literę i nadać nagłówkom ciekawszy wygląd. Na przykład, jeśli mamy nagłówek h1 z napisem 'Witaj świecie', to dzięki temu kodowi, litera 'W' zrobi się czerwona. W CSS warto ogarnąć, że :first-letter działa tylko na bloki, takie jak nagłówki czy akapity, więc warto to mieć na uwadze, gdy coś stylizujemy. Używanie pseudoelementów to dobre podejście do tworzenia ładnych i funkcjonalnych interfejsów, a przy okazji daje nam większą kontrolę nad tym, jak wyglądają nasze elementy.

Pytanie 31

Zawartość kodu w języku HTML umieszczona w ramce ilustruje zestaw

<ol>
 <li>Pierwszy</li>
 <li>Drugi</li>
 <li>Trzeci</li>
 </ol>

A. wypunktowanej

B. linków

C. skróconych

D. numerowanej

Fragment kodu HTML używa tagu <ol> co oznacza listę numerowaną. Tag <ol> jest skrótem od ordered list i jest używany do tworzenia listy elementów, które są automatycznie numerowane przez przeglądarkę. Wewnątrz tego tagu znajdują się tagi <li>, które oznaczają poszczególne elementy listy. Każdy z tych elementów będzie wyświetlany z kolejnym numerem w przeglądarce internetowej. Na przykład w przypadku zamieszczonego kodu HTML przeglądarka wyświetli listę z numerami 1 2 3 przed elementami Pierwszy Drugi Trzeci. Listy numerowane są użyteczne w sytuacjach gdy ważna jest kolejność elementów na przykład w instrukcjach krok po kroku lub rankingach. Tworzenie list numerowanych z użyciem <ol> jest zgodne ze standardami HTML i jest dobrym rozwiązaniem gdyż pozwala na łatwe zarządzanie kolejnością elementów bez konieczności ręcznego numerowania co redukuje ryzyko błędów i automatycznie aktualizuje numerację w przypadku dodania bądź usunięcia elementów z listy.

Pytanie 32

Który z czterech podstawowych kolorów modelu CMYK to:

A. brązowy

B. czarny

C. pomarańczowy

D. zielony

CMYK to model barw stosowany w druku, oparty na czterech kolorach: Cyan (niebieskozielony), Magenta (purpurowy), Yellow (żółty) oraz Key/blacK, czyli CZARNY. Dlatego jednym z czterech kolorów CMYK jest czarny.

Pytanie 33

Jakie polecenie HTML poprawnie odwzorowuje przedstawioną hierarchiczną strukturę tekstu, która została wyświetlona przez przeglądarkę w następujący sposób: Rozdział 1 tekst Podrozdział 1.1 tekst Podrozdział 1.2?

A. <h1>Rozdział 1</h1><p>tekst</p><h2>Podrozdział 1.1</h2><p>tekst</p><h2>Podrozdział 1.2</h2>

B. <big>Rozdział 1</big>tekst<big>Podrozdział 1.1</big>tekst<big>Podrozdział 1.2</big>

C. <h1>Rozdział 1<p>tekst<h2>Podrozdział 1.1<p>tekst<h2>Podrozdział 1.2

D. <ul><li>Rozdział 1<li>tekst<li>Podrozdział 1.1<li>tekst<li>Podrozdział 1.2</ul>

Poprawny kod HTML do definiowania hierarchicznej struktury tekstu oparty jest na semantycznym znaczeniu tagów. W tym przypadku, użycie <h1> dla 'Rozdział 1' jako głównego nagłówka jest zgodne z zasadami projektowania stron internetowych, gdyż <h1> powinien być używany dla najważniejszego nagłówka na stronie. Następnie zastosowanie <h2> dla 'Podrozdział 1.1' i 'Podrozdział 1.2' wskazuje na hierarchię, gdzie te podrozdziały są podkategoriami głównego rozdziału. Tag <p> jest użyty do definiowania paragrafów tekstowych, co zapewnia odpowiednie formatowanie i czytelność. Taki układ jest zgodny z wytycznymi W3C, które rekomendują używanie nagłówków w strukturze dokumentu HTML, co ułatwia zarówno przeglądarkom, jak i użytkownikom zrozumienie hierarchii treści. Przykładowo, strona internetowa z taką strukturą będzie lepiej indeksowana przez wyszukiwarki, co przyczyni się do poprawy SEO.

Pytanie 34

W CSS, aby ustalić wewnętrzny górny margines, czyli odstęp pomiędzy elementem a jego obramowaniem, należy zastosować komendę

A. outline-top

B. padding-top

C. border-top

D. local-top

Odpowiedź 'padding-top' jest prawidłowa, ponieważ w CSS termin 'padding' odnosi się do wewnętrznego odstępu, który tworzy przestrzeń pomiędzy zawartością elementu a jego granicą (border). 'padding-top' specyfikuje górny odstęp wewnętrzny, co jest istotne w kontekście estetyki i układu strony. Definiując 'padding-top', możemy dostosować wygląd elementów, aby lepiej pasowały do reszty projektu i poprawiły czytelność. Na przykład, jeśli mamy przycisk z tekstem, użycie 'padding-top: 10px;' zapewni, że tekst nie będzie przyklejony do górnego brzegu przycisku, co zwiększy jego estetykę oraz użyteczność. W praktyce dobrą praktyką jest również stosowanie 'padding' w połączeniu z 'margin', aby osiągnąć odpowiednią separację między różnymi elementami w układzie. Przestrzeganie standardów CSS pomaga w tworzeniu responsywnych i dostosowanych układów, które dobrze działają na różnych urządzeniach.

Pytanie 35

Zastosowanie bloku deklaracji background-attachment: scroll sprawia, że

A. grafika tła będzie się powtarzać (kafelki)

B. tło strony będzie się przesuwać razem z tekstem

C. grafika tła znajdzie się w prawym górnym rogu strony

D. tło strony pozostanie statyczne, a tekst będzie się przesuwał

Odpowiedź, że tło strony będzie przewijane razem z tekstem, jest prawidłowa, ponieważ właściwość 'background-attachment: scroll' definiuje, jak tło elementu powinno się zachowywać podczas przewijania strony. Kiedy używamy tej właściwości, tło jest związane z zawartością strony, co oznacza, że przewija się ono w tym samym tempie, co tekst i inne elementy. To podejście jest często wykorzystywane w projektowaniu stron internetowych, gdzie chcemy uzyskać efekt płynności i spójności. Na przykład, w przypadku długich artykułów, które wymagają przewijania, zastosowanie 'background-attachment: scroll' sprawia, że użytkownik nie jest rozpraszany przez statyczną grafikę tła, co może prowadzić do lepszego doświadczenia podczas czytania. Dobrą praktyką jest również testowanie różnych efektów tła w responsywnych projektach, aby zapewnić, że zawartość pozostaje czytelna na różnych urządzeniach. Warto również pamiętać, że styl tła można łączyć z innymi właściwościami CSS, aby osiągnąć pożądany efekt wizualny, co jest kluczowe w nowoczesnym web designie.

Pytanie 36

Jakie czynniki wpływają na wysokość dźwięku?

A. intensywność wzbudzenia drgań

B. częstotliwość drgań fali akustycznej

C. metoda wzbudzania drgań

D. czas oscylacji źródła dźwięku

Częstotliwość drgań fali akustycznej to taki kluczowy element, który wpływa na to, jak wysoko brzmi dźwięk. Mówiąc prosto, to ilość drgań, które źródło dźwięku wykonuje w danym czasie, zwykle mierzona w Hertzach (Hz). Im wyższa ta częstotliwość, tym wyższy dźwięk wydobywają instrumenty muzyczne. Na przykład na gitarze, jak skrócisz strunę, to dźwięk staje się wyższy, co jest zgodne z tym, co mówi fizyka akustyczna. W inżynierii dźwięku często korzysta się z filtrów i equalizerów, żeby odpowiednio dostosować dźwięki w nagraniach. Rozumienie tego jest ważne nie tylko w muzyce, ale i w technologiach audio. Projektanci dźwięku muszą dobrze znać te zasady, aby móc stworzyć odpowiednie efekty dźwiękowe. Więc, ogólnie mówiąc, znajomość tego, jak częstotliwość wiąże się z wysokością dźwięku, jest istotna dla każdej osoby związanej z dźwiękiem, zarówno w teorii, jak i w praktyce.

Pytanie 37

Którą właściwość CSS należy zastosować, aby ustawić grubość (pogrubienie) czcionki?

text-style

font-weight

text-weight

font-style

Grubość czcionki ustawia właściwość font-weight. Przyjmuje wartości słowne (normal, bold) lub liczbowe (100-900), np. font-weight: bold. Im wyższa liczba, tym grubsze znaki. Dlatego do pogrubienia tekstu służy font-weight.

Pytanie 38

Jakie ustawienia dotyczące czcionki będą miały zastosowanie w przypadku kodu CSS?

* {
    font-family: Tahoma;
    color: Teal;
}

A. wszystkiego kodu HTML, jako domyślne formatowanie dla wszystkich elementów strony.

B. znaczników o identyfikatorze równym *.

C. wszystkiego kodu HTML, niezależnie od kolejnych ustawień CSS.

D. znaczników z klasą przypisaną jako *.

Wybór opcji dotyczącej całego kodu HTML jako formatowania domyślnego dla wszystkich elementów strony jest poprawny, ponieważ użycie selektora uniwersalnego * w CSS oznacza, że wszystkie dostępne elementy na stronie będą dziedziczyć określone style. W tym przypadku, zarówno font-family ustawiony na Tahoma, jak i kolor tekstu zmieniony na Teal, będą dotyczyły każdego elementu HTML, bez względu na jego typ. To podejście jest zgodne z zasadami stosowania stylów kaskadowych, gdzie style są aplikowane do elementów w sposób hierarchiczny, a selektor uniwersalny jest najogólniejszym z dostępnych. Przykładem zastosowania może być sytuacja, gdy chcemy ustawić jednolite formatowanie dla całej strony, co upraszcza proces projektowania i zapewnia spójność wizualną. Dobrą praktyką jest jednak używanie selektora uniwersalnego z umiarem, aby uniknąć nadmiernego obciążenia wydajności, szczególnie w większych dokumentach, gdzie precyzyjniejsze selektory mogą przynieść lepsze rezultaty.

Pytanie 39

W celu stylizacji strony internetowej stworzono odpowiednie reguły. Reguły te będą stosowane tylko do wybranych znaczników (np. niektóre nagłówki, kilka akapitów). W tej sytuacji, aby zastosować styl do kilku wybranych znaczników, najlepiej będzie użyć

{ text-align: right; }

A. selektora akapitu.

B. identyfikatora.

C. klasy.

D. pseudoklasy.

Wybór klasy jako metody przypisania stylu do konkretnych znaczników HTML jest uzasadniony, gdyż klasy pozwalają na wielokrotne zastosowanie tego samego stylu w różnych miejscach dokumentu. Klasy definiuje się w arkuszu stylów CSS i przypisuje się je do elementów HTML za pomocą atrybutu "class". Dzięki temu, na przykład, możemy zastosować ten sam zestaw stylów do kilku nagłówków, akapitów czy innych elementów, co znacznie ułatwia zarządzanie stylizacją strony. Stosując klasy, nie musimy powielać kodu, co jest zgodne z zasadą DRY (Don't Repeat Yourself), prowadzącą do bardziej zorganizowanego i łatwiejszego w utrzymaniu kodu. Przykład użycia: jeśli stworzymy klasę "highlight" w CSS, możemy zastosować ją do kilku elementów, np. <h1 class="highlight">Nagłówek 1</h1> oraz <p class="highlight">Akapit wyróżniony.</p>. Dzięki temu, zmieniając styl w jednym miejscu, mamy wpływ na wszystkie elementy, co znacznie zwiększa efektywność i konsekwencję wizualną naszej strony. Dobrą praktyką jest także nadawanie klas nazw, które odzwierciedlają ich funkcję lub wygląd, co ułatwia późniejsze zarządzanie kodem.

Pytanie 40

Zaprezentowano kod dla tabeli 3x2. Jaką modyfikację należy wprowadzić w drugim wierszu, aby tabela przypominała tę z obrazka, gdzie wiersz jest niewidoczny?

<table>
    <tr>
        <td style="border: solid 1px;">Komórka 1</td>
        <td style="border: solid 1px;">Komórka 2</td>
    </tr>
    <tr>
        <td style="border: solid 1px;">Komórka 3</td>
        <td style="border: solid 1px;">Komórka 4</td>
    </tr>
    <tr>
        <td style="border: solid 1px;">Komórka 5</td>
        <td style="border: solid 1px;">Komórka 6</td>
    </tr>
</table>

/efekt jest na obrazie - nie dołączam - nie analizuj/

A. <pre class="code-block"><tr <span class="code-text">style=</span><span class="code-string">"clear: none"</span>></pre>

B. <pre class="code-block"><tr <span class="code-text">style=</span><span class="code-string">"display: table-cell"</span>></pre>

C. <pre class="code-block"><tr <span class="code-text">style=</span><span class="code-string">"visibility: hidden"</span>></pre>

D. <pre class="code-block"><tr <span class="code-text">style=</span><span class="code-string">"display: none"</span>></pre>

Odpowiedź jest prawidłowa, ponieważ użycie stylu 'visibility: hidden' w wierszu tabeli skutkuje tym, że wiersz ten nie jest widoczny, ale nadal zajmuje miejsce w układzie tabeli. Oznacza to, że komórki poniżej nie przesuwają się w górę, a struktura tabeli pozostaje niezmieniona. To podejście jest zgodne z sytuacjami, w których chcemy ukryć zawartość bez zmiany rozmieszczenia innych elementów. Jest to przydatne w aplikacjach, gdzie układ strony musi pozostać stabilny dla zachowania spójności wizualnej lub funkcjonalnej. Przykładem może być ukrywanie tymczasowych informacji, które nie powinny wpływać na pozostały układ interfejsu użytkownika. Jest to zgodne z dobrymi praktykami projektowania front-endu, gdzie stylizacje powinny wspierać czytelność i przewidywalność układu strony. Alternatywnie, 'display: none' usunęłoby element z przepływu dokumentu, co zmienia układ, ale w tym przypadku zastosowanie 'visibility: hidden' jest właściwym wyborem dla zachowania struktury.

Rozpocznij nowy egzamin

Powrót do strony głównej