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: 19 czerwca 2026 13:11
Data zakończenia: 19 czerwca 2026 13:27

Egzamin zdany!

Wynik: 25/40 punktów (62,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

Aby przygotować układ strony z trzema kolumnami ustawionymi obok siebie, można posłużyć się stylem CSS:

.kolumny {
  float: left;
  width: 40%;
}

.kolumny {
  clear: both;
  height: 33%;
}

.kolumny {
  float: left;
  width: 33%;
}

.kolumny {
  float: right;
  height: 33%;
}

Pozostałe style nie dadzą trzech równych kolumn obok siebie. Wariant z float: right i height: 33% steruje wysokością, a nie szerokością elementów - a to szerokość decyduje o tym, ile kolumn zmieści się w rzędzie. Styl z clear: both wręcz wyłącza opływanie, więc elementy zostaną ustawione jeden pod drugim, zamiast obok siebie. Ostatni jest bliski poprawnemu (ma float: left), ale width: 40% jest za duże - trzy kolumny po 40% przekraczają 100% szerokości i ostatnia spadnie do następnego rzędu. Trzy równe kolumny daje float: left z width: 33%.

Pytanie 2

W języku HTML, aby ustawić tytuł dokumentu na "Moja strona", który będzie widoczny na karcie przeglądarki internetowej, należy użyć zapisu

A. <meta name="title" content="Moja strona">

B. <title>Moja strona</title>

C. <meta title="Moja strona">

D. <head>Moja strona</head>

Odpowiedź <title>Moja strona</title> jest poprawna, ponieważ element <title> jest standardowym sposobem definiowania tytułu dokumentu HTML, który jest wyświetlany na pasku tytułowym przeglądarki. Zgodnie z normą HTML, element ten powinien być umieszczony wewnątrz sekcji <head> dokumentu. Przykładowa struktura dokumentu HTML z tytułem wygląda następująco: <html><head><title>Moja strona</title></head><body></body></html>. Tytuł jest istotny nie tylko dla użytkowników, ale również dla wyszukiwarek internetowych, ponieważ wpływa na SEO (Search Engine Optimization). Dobrze dobrany tytuł może zwiększyć klikalność linków w wynikach wyszukiwania. Dodatkowo, element <title> jest ważnym aspektem dostępności, ponieważ osoby korzystające z technologii asystujących polegają na nim, aby zrozumieć zawartość strony. W kontekście dobrych praktyk warto pamiętać, że tytuł powinien być krótki, zwięzły i adekwatny do treści strony. Warto również unikać duplikatów tytułów na różnych stronach tej samej witryny, co może prowadzić do chaosu w nawigacji i negatywnie wpływać na doświadczenia użytkowników oraz SEO.

Pytanie 3

Aby zapisać prostą animację na potrzeby strony internetowej, można skorzystać z formatu:

A. CDR

B. GIF

C. JPG

D. PNG

Do zapisania prostej animacji na stronę internetową nadaje się format GIF. Plik GIF może przechowywać wiele klatek wyświetlanych po kolei w pętli, więc tworzy krótką animację bez potrzeby stosowania wideo. Obsługuje też przezroczystość, choć ogranicza paletę do 256 kolorów. To dlatego proste, lekkie animacje (np. ikony, banery) zapisuje się właśnie jako GIF.

Pytanie 4

W semantycznym HTML odpowiednikiem elementu <b>, który nie tylko pogrubia tekst, ale także wskazuje na jego większe znaczenie, jest

A. <strong>

B. <mark>

C. <em>

D. <ins>

Znacznik <strong> w HTML semantycznym służy nie tylko do pogrubienia tekstu, ale także do wskazania, że dany fragment ma większe znaczenie w kontekście semantycznym. Zgodnie z zaleceniami W3C, użycie tego znacznika poprawia dostępność treści, ponieważ technologie wspomagające, takie jak czytniki ekranu, interpretują <strong> jako tekst o podwyższonej wadze, co może pomóc w lepszym zrozumieniu struktury dokumentu przez osoby z niepełnosprawnościami. Przykładem zastosowania może być podkreślenie ważnych informacji na stronie, takich jak zasady, ostrzeżenia czy kluczowe dane, które użytkownicy powinni zauważyć. W praktyce, stosowanie elementów semantycznych, takich jak <strong>, zamiast czysto stylistycznych, jest zgodne z zasadami budowania stron przyjaznych dla użytkowników i poprawia SEO, ponieważ wyszukiwarki mogą lepiej analizować kontekst treści. Warto pamiętać, że w przypadku użycia <strong>, nie zmienia to tylko sposobu wyświetlania, ale także wzbogaca znaczenie tekstu w kontekście całej strony.

Pytanie 5

W języku HTML zapis < spowoduje w przeglądarki wyświetlenie znaku

A. "

B. <

C. >

D. &

Znak < w HTML ma specjalne znaczenie, ponieważ jest używany do oznaczania początku znaczników, które są fundamentem struktury dokumentów HTML. Aby prawidłowo wyświetlić ten znak w przeglądarce, należy użyć encji HTML, która dla znaku mniejszości to <. Użycie encji pozwala na uniknięcie nieporozumień, ponieważ przeglądarka mogłaby zinterpretować znak < jako początek nowego znacznika. Przykładowo, aby wyświetlić tekst 'A < B' w HTML, kod powinien wyglądać następująco: A < B. Zgodnie z dokumentacją W3C, stosowanie encji jest kluczowe dla zachowania poprawności kodu. Dzięki temu użytkownicy mogą zobaczyć zamierzony tekst, zamiast nieprawidłowo interpretowanego oznaczenia. Warto również zauważyć, że istnieją inne encje, takie jak > dla znaku większości oraz & dla znaku ampersand, które również pełnią istotne funkcje w kontekście HTML. Poprawne użycie encji przyczynia się do lepszej dostępności i zobrazowania treści na stronach internetowych."

Pytanie 6

Prezentowany fragment dokumentu HTML z użyciem JavaScript spowoduje, że po naciśnięciu przycisku

<img src="obraz1.png">
<img src="obraz2.png" id="id1">
<button onclick="document.getElementById('id1').style.display='none'">Przycisk</button>

A. obraz2.png zostanie zniknięty

B. obraz1.png zostanie wymieniony przez obraz2.png

C. obraz2.png zostanie wymieniony przez obraz1.png

D. obraz1.png zostanie zniknięty

Błędne odpowiedzi opierają się na nieporozumieniach dotyczących działania JavaScript i manipulacji DOM. Wskazanie, że 'obraz1.png' zostanie ukryty, jest niepoprawne, ponieważ w kodzie nie ma żadnej instrukcji odnoszącej się do tego elementu; zmiany dotyczą tylko 'obraz2.png'. Innym błędnym wnioskiem jest twierdzenie, że 'obraz2.png' zostanie zastąpiony przez 'obraz1.png'. Taki scenariusz wymagałby zmiany źródła obrazu, a nie ukrycia elementu. Ponadto, stwierdzenie, że 'obraz1.png' zostanie zastąpiony przez 'obraz2.png', również ignoruje fakt, że w kodzie nie ma operacji przypisania ani zmiany źródła. Zrozumienie, jak JavaScript interaguje z HTML, jest kluczowe dla efektywnego tworzenia stron internetowych. Programiści muszą być świadomi, że ukrywanie elementów nie wpływa na inne elementy w dokumencie, a jedynie zmienia ich styl wyświetlania. Dlatego ważne jest, aby dobrze zrozumieć koncepcje manipulacji DOM oraz różnice między ukrywaniem elementów a ich usuwaniem, co pozwala na bardziej złożone i interaktywne doświadczenia na stronach internetowych.

Pytanie 7

Który znacznik sekcji <head> jest wymagany w HTML5, a jego brak walidator zgłasza jako błąd?

link

title

style

meta

Pozostałe znaczniki <head> są opcjonalne. <link> dołącza zasoby (np. CSS), <meta> podaje metadane, a <style> zawiera reguły CSS - żaden nie jest wymagany. Obowiązkowy jest <title>.

Pytanie 8

Który format graficzny zapisuje fotografie z kompresją stratną i nie obsługuje przezroczystości?

A. SVG

B. GIF

C. PNG

D. JPG

JPG (JPEG) to format rastrowy z kompresją stratną - przy zapisie odrzuca część informacji niewidocznej dla oka, dzięki czemu pliki zdjęć są małe. Sprawdza się przy fotografiach z płynnymi przejściami kolorów. Nie obsługuje jednak przezroczystości i przy mocnej kompresji pojawiają się artefakty. Dlatego fotografie zapisywane stratnie, bez przezroczystości, to format JPG.

Pytanie 9

Aby obraz na stronie automatycznie dopasowywał się do rozmiaru ekranu, na którym strona jest wyświetlana, należy:

A. jego szerokość ustawić w wartościach procentowych

B. oba jego wymiary ustawić w pikselach

C. jeden z wymiarów ustawić w pikselach

D. nie zmieniać jego wymiarów stylami CSS

Responsywny obraz skaluje się razem z układem strony. Uzyskuje się to, ustawiając jego szerokość w jednostce względnej - w procentach, na przykład img { width: 100%; max-width: 100%; }. Obraz dopasowuje się wtedy do szerokości kontenera, a wysokość zwykle pozostawia się jako auto, by zachować proporcje. Dlatego szerokość obrazu ustawia się w wartościach procentowych.

Pytanie 10

Znacznik

<pre> </pre>

służy do prezentacji:

A. znaku przekreślenia

B. treści polską czcionką

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

D. znaku wielokropka

Interpretacja znacznika <pre> jako narzędzia do wyświetlania znaku przekreślenia lub wielokropka jest błędna, ponieważ te elementy nie mają związku z funkcją, jaką pełni <pre>. W kontekście HTML, znacznik <pre> nie jest zaprojektowany do formatowania treści na podstawie stylów czcionek, takich jak 'polska czcionka', ale skupia się na zachowaniu oryginalnego formatowania tekstu. Próba zrozumienia <pre> w kontekście czcionek wyłącznie ze względu na ich wygląd prowadzi do pomyłek, ponieważ nie dotyczy to głównego celu tego znacznika. Ponadto, używanie <pre> dla treści, które nie wymagają stałej szerokości czcionki, może prowadzić do złożonych problemów w responsywności układu strony oraz trudności w dostosowaniu treści do różnych urządzeń. Znaki przekreślenia i wielokropka są raczej reprezentowane przez inne znaczniki HTML, takie jak <s> lub <span>, które są bardziej odpowiednie do stylizacji tekstu. Właściwe zrozumienie roli każdego znacznika HTML jest kluczowe dla skutecznego projektowania stron internetowych i aplikacji, co podkreśla znaczenie edukacji w zakresie web developmentu.

Pytanie 11

Jakiej informacji NIE umieszcza się w znaczniku <meta>?

A. o automatycznym odświeżaniu strony

B. o typie (wersji) dokumentu

C. o autorze strony

D. o kodowaniu znaków

Typ (wersję) dokumentu deklaruje się osobnym zapisem <!DOCTYPE> na początku pliku, a NIE w znaczniku <meta>. Dlatego w <meta> nie umieszcza się informacji o typie dokumentu.

Pytanie 12

Gdzie w dokumencie HTML mogą być umieszczane fragmenty kodu JavaScript?

A. jedynie w sekcji <head>, w znaczniku <script>

B. tak w sekcji <head>, jak i <body>, w znaczniku <java>

C. zarówno w sekcji <head>, jak i <body>, w znaczniku <script>

D. wyłącznie w sekcji <body>, w znaczniku <java>

Wiesz, wstawianie kodu JavaScript do dokumentu HTML powinno odbywać się w znaczniku <script>. Możesz go umieścić zarówno w <head>, jak i w <body>. Często wrzucamy skrypty do <head>, bo chcemy, żeby załadowały się przed wyświetleniem treści. To się przydaje, gdy skrypty zmieniają coś w DOM. Z drugiej strony, jak wrzucisz je do <body>, to skrypty będą ładowane po całej treści, co może przyspieszyć to, co widzi użytkownik. Na przykład, jeśli tworzysz coś interaktywnego, lepiej umieścić skrypty na dole, żeby nie blokować renderowania. Dobrze jest też pamiętać o atrybucie 'defer' w <script>, bo dzięki temu skrypt się ściąga równolegle z innymi rzeczami, ale działa dopiero jak cały dokument jest załadowany. To ważne, żeby strony działały sprawnie i były przyjemne w użytkowaniu.

Pytanie 13

Brak którego elementu spowoduje błąd walidatora dokumentu HTML5?

A. <meta name="author" content="...">

B. prologu <!DOCTYPE html>

C. <body>

D. przynajmniej jednego <h1>

Pozostałe elementy nie są wymagane do przejścia walidacji. <meta name="author"> to opcjonalna metadana - podaje autora strony, ale jej pominięcie niczego nie psuje. Nagłówek <h1> bywa zalecany dla struktury i SEO, lecz dokument bez niego nadal jest poprawny składniowo. Znacznika <body> walidator może domyślnie założyć, więc jego brak nie generuje błędu. Obowiązkowa jest deklaracja <!DOCTYPE html> na początku dokumentu, dlatego to ona jest poprawną odpowiedzią.

Pytanie 14

Jak ustawić tło body obrazem rys.png, powtarzanym TYLKO w poziomie?

background-image: url("rys.png"); background-repeat: repeat-x;

background-image: url("rys.png"); background-repeat: round;

background-image: url("rys.png"); background-repeat: repeat-y;

background-image: url("rys.png"); background-repeat: repeat;

Powtarzanie obrazu tła reguluje background-repeat. Wartość repeat-x powiela obraz TYLKO w poziomie (wzdłuż osi X), tworząc poziomy pas. Dlatego tło powtarzane jedynie w poziomie daje background-repeat: repeat-x.

Pytanie 15

Które z poniższych formatowań NIE jest zapisem w języku CSS?

<body bgcolor="yellow">

<body style="background-color: yellow;">

<style> body { background-color: yellow; } </style>

body { background-color: yellow; }   (plik .css)

Pozostałe trzy zapisy to CSS, tylko osadzony w różny sposób. Reguła background-color: yellow w <style> to arkusz wewnętrzny, ta sama reguła w pliku .css to arkusz zewnętrzny, a style="background-color: yellow;" w znaczniku to styl śródliniowy - wszystkie używają właściwości CSS. Wyjątkiem jest <body bgcolor="yellow">: bgcolor to atrybut HTML (przestarzały), a nie właściwość CSS. Dlatego to ten zapis nie jest formatowaniem CSS i jest poprawną odpowiedzią.

Pytanie 16

Pokazane pole input pozwala na

A. wprowadzenie dowolnego tekstu

B. selekcja opcji z listy o wartościach text1 i text2

C. wybranie opcji

D. wprowadzenie hasła

Odpowiedź "zaznaczenie opcji" jest na pewno trafna, bo pole checkbox (<input type='checkbox'>) jest stworzone do tego, żeby użytkownicy mogli wybrać jedną lub więcej opcji z danej grupy. Widzisz, checkboxy są bardzo popularne w formularzach internetowych, bo pozwalają na różnorodność wyborów, w przeciwieństwie do przycisków radiowych, które pozwalają na zaznaczenie tylko jednej opcji. Na przykład, jak się rejestrujesz na stronie, możesz zaznaczyć różne zgody na przetwarzanie danych, co daje możliwość wyboru więcej niż jednej opcji. Z punktu widzenia HTML i najlepszych praktyk w projektowaniu formularzy, warto dodać odpowiednie etykiety (label) do checkboxów, żeby ułatwić korzystanie z nich osobom, które używają technologii asystujących. Jeśli dobrze ustalimy atrybuty 'name' i 'value', to dane po przesłaniu formularza będą odpowiednio przetworzone. Pamiętaj, że wartość checkboxa jest przesyłana tylko wtedy, gdy jest zaznaczony, co jest zgodne z oczekiwaniami użytkowników oraz standardami W3C.

Pytanie 17

W CSS określono styl dla stopki. Jak można zastosować to formatowanie do bloku oznaczonego znacznikiem div?

#stopka { ... }

A. <div "stopka"> …

B. <div id = "stopka"> …

C. <div class = "stopka"> …

D. <div title = "stopka"> …

Poprawnie – zapis #stopka w CSS oznacza selektor identyfikatora (ID), więc w HTML musimy użyć atrybutu id="stopka" dokładnie z tą samą nazwą. W CSS znak # wskazuje, że styl jest przypisany do elementu o konkretnym identyfikatorze, a nie do klasy czy czegokolwiek innego. Dlatego jedynym prawidłowym sposobem podpięcia tego stylu do bloku div jest konstrukcja: <div id="stopka">…</div>.
W praktyce wygląda to tak:
CSS:
#stopka {
background-color: #333;
color: white;
padding: 20px;
}
HTML:
<div id="stopka">To jest stopka strony</div>
Przeglądarka łączy selektor #stopka z elementem, który ma id="stopka" i nakłada na niego zdefiniowane właściwości. Identyfikator powinien być unikalny w obrębie całego dokumentu HTML, co jest zgodne z zaleceniami W3C i ogólnie przyjętą dobrą praktyką. Do jednego ID odwołujemy się w CSS przez #, a w JavaScript przez document.getElementById("stopka").
Moim zdaniem warto zapamiętać prostą zasadę: # w CSS = id w HTML, kropka (.) w CSS = class w HTML. Gdy projektujesz layout strony, zwykle elementy typu nagłówek, stopka, główna nawigacja mają unikalne ID, bo występują raz na stronie. Natomiast powtarzalne elementy (np. kafelki z produktami) dostają klasy. Dzięki temu kod jest czytelniejszy, łatwiej się go utrzymuje i unikamy dziwnych konfliktów stylów. Dobrą praktyką jest też używanie opisowych nazw, np. id="stopka" zamiast skrótów typu id="s1", bo po miesiącu nikt nie pamięta, co to znaczyło.

Pytanie 18

Którym znacznikiem osadzić kod CSS wewnątrz dokumentu HTML?

<meta>

<style>

<head>

<body>

Kod CSS osadza się wewnątrz dokumentu HTML w znaczniku <style>, umieszczanym zwykle w sekcji <head>. Reguły zapisane między <style> a </style> stylują elementy całej strony. Dlatego CSS osadza się znacznikiem <style>.

Pytanie 19

W trakcie weryfikacji stron internetowych nie analizuje się

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

B. funkcjonowania linków

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

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

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 20

Zapis tagu HTML w formie <a href="#hobby">przejdź</a>?

A. jest poprawny, po kliknięciu w odnośnik otworzy się strona internetowa o adresie "hobby"

B. jest poprawny, po kliknięciu w odnośnik aktualna strona zostanie przewinięta do elementu o nazwie "hobby"

C. jest błędny, w atrybucie href trzeba wpisać adres URL

D. jest błędny, niepoprawnie użyto znaku "#" w atrybucie href

Myślenie, że znacznik <a href="#hobby">przejdź</a> jest błędny, bo używasz znaku '#' w href, jest trochę mylące. Ten znak '#' to normalny sposób, żeby wskazać lokalne odnośniki na tej samej stronie, co jest zgodne z regułami HTML. Nie jest prawdą, że musi być cały adres URL, bo lokalne identyfikatory są jak najbardziej w porządku. Często spotykam się z przekonaniem, że href zawsze powinien prowadzić do zewnętrznego linku, a to nieprawda. Wiele stron korzysta z lokalnych linków, co naprawdę sprawdza się w długich treściach, pozwalając użytkownikom szybko przechodzić do tych sekcji, które ich interesują. Nie można też myśleć, że tylko absolutne identyfikatory w href są jedynym słusznym rozwiązaniem, bo to podejście z lokalnymi odnośnikami jest powszechnie akceptowane i sprawdza się w praktyce.

Pytanie 21

Aby umożliwić wybór kilku opcji jednocześnie w rozwijanej liście formularza HTML, należy dodać atrybut do znacznika select

A. disabled

B. size

C. value

D. multiple

Atrybut multiple w znaczniku select w HTML to super sprawa, bo dzięki niemu można zaznaczyć więcej niż jedną opcję z listy rozwijalnej. To się przydaje, jak ktoś musi wybrać kilka elementów w formularzu. Jak dodasz atrybut multiple, to przeglądarka pokazuje to jako pole do wyboru, gdzie można klikać na kilka wartości za pomocą klawiszy Ctrl albo Shift. Fajnie, że ten atrybut nie wymaga żadnych dodatkowych wartości, wystarczy, że go wrzucisz do znacznika select. To zgodne z dobrymi praktykami UX, bo pozwala na większą elastyczność i interaktywność formularzy. Co więcej, nie trzeba być programistycznym guru, żeby to wdrożyć, więc każdy może to zrobić. Używa się go w różnych aplikacjach webowych, zwłaszcza tam, gdzie zbieranie danych od użytkowników w prosty i przejrzysty sposób jest ważne.

Pytanie 22

Poniżej zaprezentowano fragment kodu w języku HTML:
<ol>
<li>punkt 1</li>
<li>punkt 2</li>
<ul>
<li>podpunkt1</li>
<li>podpunkt2</li>
<li>podpunkt3</li>
</ul>
<li>punkt3</li>
</ol>

A. punkt 1 punkt 2 podpunkt1 podpunkt2 podpunkt3 punkt3

B. 1. punkt 1 2. punkt 2 podpunkt1 podpunkt2 podpunkt1 3. punkt3

C. 1. punkt 1 2. punkt 2 podpunkt1 podpunkt2 podpunkt3 punkt3

D. 1. punkt 1 2. punkt 2 3. punkt3 podpunkt1 podpunkt2 podpunkt1

Widzisz, w niektórych odpowiedziach pojawiły się błędy, które mogą wprowadzać zamieszanie. Na przykład, użycie <il> zamiast <ul> to spory błąd, bo w HTML nie mamy elementu <il>. To może spowodować problemy z wyświetlaniem strony w przeglądarkach. I w paru przypadkach z kolejnością podpunktów było nie tak – pamiętaj, że hierarchia jest ważna. Dobrze zdefiniowane listy powinny mieć swoje konteksty, czyli otaczać je tagami <ol> lub <ul>. Każdy błąd w tym zakresie może utrudnić nawigację po stronie, zwłaszcza dla osób z niepełnosprawnościami. Ogólnie rzecz biorąc, warto dbać o porządek w HTML, bo to jest kluczowe w tworzeniu stron, które są użyteczne i funkcjonalne.

Pytanie 23

Znacznik <i> w języku HTML ma na celu

A. określenie formularza

B. dodanie grafiki

C. zmianę czcionki na kursywę

D. ustalenie nagłówka w treści

Znacznik <i> w języku HTML jest używany do formatowania tekstu, aby uzyskać efekt pochylonego kroju pisma. Jest to element semantyczny, który wprowadza do dokumentu wizualną różnicę, ale także ma swoje miejsce w kontekście znaczeniowym. Użycie <i> może wskazywać na zmianę intonacji w tekście, taką jak nazwy książek, filmów, czy obcych wyrazów. W standardach HTML5, <i> jest zalecany do użytku, aby wyróżnić elementy tekstowe w sposób, który jest zgodny z zasadami dostępności i semantyki. Przykład zastosowania: <p>W książce <i>W pustyni i w puszczy</i> autorstwa Henryka Sienkiewicza...</p>. Oznaczanie tekstu w ten sposób wspiera nie tylko estetykę strony, ale również poprawia doświadczenie użytkowników korzystających z technologii asystujących, które mogą interpretować znaczenie tak oznaczonego tekstu. Warto również pamiętać o odpowiednich stylach CSS, które można zastosować do tego znacznika, aby dostosować jego wygląd do reszty witryny.

Pytanie 24

W języku HTML zdefiniowano znacznik

<a href="http://website.com" rel="nofollow">link</a>

Wartość nofollow atrybutu rel

A. jest informacją dla robota wyszukiwarki Google, aby nie podążał za tym linkiem.

B. jest informacją dla przeglądarki internetowej, aby nie formatowała słowa "link" jako odnośnika.

C. oznacza, że kliknięcie na link nie przeniesie do strony website.com.

D. oznacza, że kliknięcie na link otworzy go w osobnej karcie przeglądarki.

Dobrze, że to wybrałeś! Atrybut rel='nofollow' w tagu <a> w HTML mówi robotom wyszukiwarek, jak Google, żeby nie śledziły tego linku. Często używa się go w SEO, czyli w optymalizacji stron. Dzięki temu możemy zdecydować, które linki na naszej stronie są ważne, a które nie. Jeśli mamy na myśli, żeby dana strona była mniej widoczna w wyszukiwarkach, to ten atrybut się przyda. Tylko musisz pamiętać, że zbyt wiele linków z 'nofollow' może sprawić, że wyszukiwarki nie będą patrzyły na naszą stronę za dobrze. Moim zdaniem, warto to dobrze przemyśleć!

Pytanie 25

Które z wymienionych NIE jest wykonywane po stronie serwera?

A. CSS

B. Perl

C. PHP

D. ASP

CSS działa po stronie KLIENTA - to przeglądarka interpretuje arkusz stylów i renderuje wygląd u użytkownika. Nie jest przetwarzany na serwerze. Dlatego po stronie serwera nie wykonuje się CSS.

Pytanie 26

Który zapis znacznika <meta> jest poprawny pod względem użytych atrybutów?

<meta name="!DOCTYPE">

<meta background="blue">

<meta title="Strona dla hobbystów">

<meta name="description" content="...">

Znacznik <meta> opisuje stronę parą atrybutów name i content, więc poprawny jest <meta name="description" content="..."> - name mówi, o jaką informację chodzi, a content podaje jej treść (tu opis strony dla wyszukiwarek). Zapamiętaj wzorzec: <meta name="..." content="...">.

Pytanie 27

Co powinien umożliwiać edytor działający w trybie WYSIWYG?

A. uzyskanie wyglądu strony zbliżonego do jej obrazu w przeglądarce

B. tworzenie podstawowej grafiki wektorowej

C. obróbkę plików dźwiękowych

D. publikację strony przez wbudowany klient FTP

WYSIWYG dotyczy edycji z podglądem wyglądu, a nie innych funkcji. Tworzenie grafiki wektorowej, klient FTP do publikacji czy obróbka dźwięku to osobne narzędzia. Istotą WYSIWYG jest uzyskanie wyglądu zbliżonego do obrazu strony w przeglądarce.

Pytanie 28

W nagłówku dokumentu HTML umieszczono

<title>Strona miłośników psów</title>

Tekst ten pojawi się

A. w zawartości strony, w pierwszym widocznym nagłówku

B. na pasku tytułowym przeglądarki

C. w zawartości strony, na banerze

D. w polu adresowym, przy podanym adresie URL

Tag <title> w HTML to naprawdę istotny element dla każdej strony internetowej. Jest to coś, co pomaga ludziom szybko zorientować się, o co chodzi na danej stronie, zwłaszcza gdy mamy otwartych kilka kart w przeglądarce. Dobry tytuł nie tylko ułatwia nawigację, ale także ma spory wpływ na to, jak strona wypada w wyszukiwarkach. Z własnego doświadczenia mogę powiedzieć, że jeśli tytuł jest konkretny i zawiera ważne słowa kluczowe, to zwiększa szanse na przyciągnięcie użytkowników. Na przykład, jeśli strona jest dla miłośników psów, to warto w tytule umieścić słowa takie jak 'psy' czy 'opiekunowie psów'. Taki przykład mógłby wyglądać tak: <title>Miłośnicy psów - Porady, opieka, zdrowie</title>. Dobrze zrobiony tytuł może też poprawić CTR, czyli współczynnik klikalności, co jest ważne, żeby przyciągnąć więcej odwiedzających.

Pytanie 29

Na przedstawionym obrazie widać wynik formatowania przy użyciu styli CSS oraz kod HTML, który go generuje. Przy założeniu, że marginesy wewnętrzne wynoszą 50 px, a zewnętrzne 20 px, jak wygląda styl CSS dla tego obrazu?

A. Rys. A

B. Rys. B

C. Rys. C

D. Rys. D

Błędne odpowiedzi wynikają głównie z nieprawidłowego przypisania wartości marginesów i marginesów wewnętrznych w stylach CSS. W przypadku niepoprawnych stylów, takich jak w Rys. A i D, zastosowano linię przerywaną, co nie spełnia warunków pytania, które wymaga zastosowania linii ciągłej. Solidna linia graniczna jest bardziej preferowana w projektach profesjonalnych, ponieważ dodaje wyrazistości i estetyki. Warianty, gdzie nie zachowano odpowiednich wartości marginesów i marginesów wewnętrznych, mogą prowadzić do niezamierzonego zachowania w układzie strony, takich jak zły odstęp między elementami, co negatywnie wpływa na użyteczność i estetykę interfejsu użytkownika. Niewłaściwe ustawienie tych wartości często wynika z niedostatecznego zrozumienia modelu pudełkowego w CSS, który jest fundamentem w projektowaniu rozmieszczenia elementów na stronie. Model pudełkowy umożliwia dokładne określenie, jak elementy są wyświetlane, co jest niezbędne do tworzenia responsywnych i estetycznie przyjemnych stron internetowych. Zrozumienie i prawidłowe zastosowanie marginesów i marginesów wewnętrznych jest kluczowe dla osiągnięcia profesjonalnych wyników w projekcie.

Pytanie 30

Czy przedstawione w języku CSS ustawienia czcionki będą dotyczyć dla

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

A. całego dokumentu HTML, niezależnie od późniejszych reguł CSS

B. znaczników o id równym *

C. znaczników z klasą przypisaną równą *

D. całego dokumentu HTML, jako domyślne formatowanie dla wszystkich elementów strony

Właściwość CSS zastosowana w podanym kodzie dotyczy wszystkich elementów HTML na stronie, ponieważ użycie selektora * oznacza, że formatowanie będzie miało zastosowanie do każdego elementu, niezależnie od jego typu. Oznacza to, że czcionka Tahoma oraz kolor Teal będą domyślnie stosowane do tekstu we wszystkich znacznikach HTML. Tego rodzaju podejście jest zgodne z dobrymi praktykami w projektowaniu stron, ponieważ pozwala na jednolite formatowanie bez konieczności stylizowania każdego elementu z osobna. Przykładem zastosowania może być stworzenie spójnego wyglądu strony, gdzie wszystkie nagłówki, akapity i inne teksty mają ten sam styl, co poprawia czytelność i estetykę. Dodatkowo, takie zastosowanie stylów jest efektywne, gdyż zmiana stylu w kontekście całej strony odbywa się poprzez edytowanie jednego miejsca w kodzie CSS, co oszczędza czas i zmniejsza ryzyko błędów.

Pytanie 31

Reprezentacja znacznika HTML w formacie

<a href="#hobby">przejdź</a>

A. jest poprawny, po kliknięciu w odnośnik strona zostanie przewinięta do sekcji o nazwie "hobby"

B. jest poprawny, po kliknięciu w odnośnik otworzy się strona internetowa o URL "hobby"

C. jest błędny, użyto niewłaściwego znaku "#" w atrybucie href

D. jest błędny, w atrybucie href należy wpisać adres URL

W odpowiedziach, które wskazują na błędy w zapisie znacznika HTML, pojawiają się nieporozumienia dotyczące funkcji atrybutu href w tagu <a>. Niepoprawne są twierdzenia sugerujące, że użycie znaku '#' w atrybucie href jest błędne. Wręcz przeciwnie, znak '#' jest standardowym sposobem definiowania odnośników do identyfikatorów na tej samej stronie. Zastosowanie atrybutu href w takiej formie jest powszechnie akceptowane i stosowane w praktyce web developerskiej. Kolejnym błędnym wnioskiem jest stwierdzenie, że w atrybucie href należy podać pełny adres URL. W rzeczywistości, gdy celem jest nawigacja do sekcji na tej samej stronie, wystarczy użyć symbolu '#' i odpowiedniego identyfikatora. Dodatkowo, pominięcie praktyki użycia href do nawigacji wewnętrznej prowadzi do mniejszych korzyści w zakresie użyteczności strony. Użytkownicy oczekują, że będą mogli łatwo przemieszczać się pomiędzy różnymi sekcjami długich treści, a niewłaściwe podejście do definiowania odnośników może prowadzić do frustracji i obniżenia jakości doświadczeń użytkowników. Warto zatem zrozumieć, że poprawne stosowanie takich odnośników jest kluczowe dla skutecznego projektowania stron internetowych.

Pytanie 32

Funkcja colspan umożliwia łączenie komórek tabeli w układzie poziomym, natomiast rowspan w układzie pionowym. Która z poniższych tabel odpowiada fragmentowi kodu w języku HTML?

A. Odpowiedź A

B. Odpowiedź C

C. Odpowiedź B

D. Odpowiedź D

Polecenie rowspan w języku HTML służy do łączenia komórek tabeli w pionie. W podanym fragmencie kodu HTML, atrybut rowspan jest użyty z wartością 2 w pierwszej komórce pierwszego wiersza. Oznacza to, że ta komórka będzie się rozciągać na dwa wiersze, co jest widoczne w odpowiedzi B. Tabelę HTML można wykorzystać do tworzenia złożonych struktur danych, gdzie rowspan jest kluczowe w przypadku, gdy chcemy zminimalizować liczbę komórek i lepiej zorganizować dane w pionowe bloki. Użycie rowspan jest zgodne ze standardami HTML5, które zalecają semantyczne i logiczne układanie danych. Praktyczne zastosowanie rowspan można znaleźć w projektach takich jak raporty finansowe czy skomplikowane formularze, gdzie często wymagane jest łączenie komórek w pionie. W projektowaniu stron internetowych zaleca się stosowanie tabel w przypadkach rzeczywistych danych tabelarycznych, a nie do układu strony, co jest zgodne z wytycznymi dotyczącymi dostępności WCAG.

Pytanie 33

Na podstawie filmu wskaż, która cecha dodana do stylu CSS zamieni miejscami bloki aside i nav, pozostawiając w środku blok section?

A. nav { float: right; } section { float: right; }

B. aside {float: left; }

C. nav { float: right; }

D. nav { float: left; } aside { float: left; }

W tym zadaniu kluczowe jest zrozumienie, jak naprawdę działa float, a nie tylko samo skojarzenie, że „left to lewo, right to prawo”. Wiele osób myśli, że wystarczy ustawić jeden element na lewo, drugi na prawo i wszystko magicznie się poukłada. W praktyce przeglądarka trzyma się bardzo konkretnych reguł: najpierw liczy kolejność elementów w HTML, potem dopiero stosuje float i układa je możliwie jak najwyżej i jak najbliżej odpowiedniej krawędzi.

Jeśli nada się float tylko dla aside albo tylko dla nav, to zmienia się ich pozycja, ale układ trzech bloków nie spełni warunku z zadania: aside i nav nie zamienią się miejscami z pozostawieniem section w środku. Przykładowo, samo float: left na aside niczego nie „zamieni”, bo element i tak pojawia się jako pierwszy w kodzie, więc będzie u góry, tylko że „przyklejony” do lewej. Z kolei ustawienie nav na prawą stronę bez odpowiedniego floatowania section prowadzi do sytuacji, gdzie section nadal zachowuje się jak normalny blok, zwykle ląduje pod elementami pływającymi albo obok nich w sposób mało przewidywalny dla początkującego.

Częsty błąd myślowy polega też na tym, że ktoś próbuje wszystkim elementom dać float: left, licząc na to, że przeglądarka „ułoży je po swojemu”. Wtedy jednak wszystkie te bloki ustawiają się w jednym kierunku, w kolejności z HTML, więc nie ma mowy o świadomym „zamienianiu miejsc”. Brak zrozumienia, że float wyjmuje element z normalnego przepływu i wpływa na to, jak kolejne elementy zawijają się wokół niego, prowadzi właśnie do takich błędnych odpowiedzi. Z mojego doświadczenia lepiej jest najpierw narysować sobie prosty schemat: w jakiej kolejności idą znaczniki i które z nich mają pływać w prawo, a które zostać w naturalnym układzie. Dopiero wtedy dobiera się konkretne deklaracje CSS. Takie myślenie przydaje się nie tylko przy float, ale też przy nauce flexboxa czy grida, gdzie kolejność w DOM i własności układu też grają ogromną rolę.

Pytanie 34

Znacznik <strong> tekst</strong> w HTML będzie ukazywany przez przeglądarkę w identyczny sposób, jak znacznik

A. <b>tekst</b>

B. <big>tekst</big>

C. <sub>tekst</sub>

D. <h1>tekst</h1>

Znacznik <strong> w języku HTML jest używany do oznaczania tekstu, który ma być wyświetlany w sposób wyróżniony, co sugeruje jego większe znaczenie, natomiast znacznik <b> jest używany tylko do pogrubienia tekstu, bez dodatkowego kontekstu semantycznego. Oba znaczniki są wizualnie identyczne w większości przeglądarek, co powoduje, że można je stosować zamiennie w niektórych przypadkach. Jednakże, zgodnie z najnowszymi standardami HTML, zaleca się używanie <strong> dla tekstu, który ma większe znaczenie, ponieważ to pomaga w SEO i dostępności. Na przykład, tekst umieszczony w znaczniku <strong> może być lepiej interpretowany przez technologie wspomagające, takie jak czytniki ekranu, co czyni go bardziej dostępnym dla osób z niepełnosprawnościami. Przykład użycia: <strong>ważne informacje</strong> w odróżnieniu od <b>ważne informacje</b>, gdzie znaczenie semantyczne jest pominięte. Dlatego, mimo że wizualnie nie widać różnicy, semantyka HTML jest kluczowym aspektem, który wpływa na sposób, w jaki treść jest interpretowana i przetwarzana przez różnorodne systemy.

Pytanie 35

W jakim standardzie języka hipertekstowego wprowadzono do składni znaczniki sekcji <footer>, <header>, <nav>?

A. XHTML 2.0

B. XHTML1.0

C. HTML5

D. HTML4

Tak, znaczników <footer>, <header> i <nav> zaczęto używać w HTML5, który zadebiutował w październiku 2014 roku. To jest ciekawe, bo HTML5 wprowadził sporo nowych semantycznych elementów, które pomagają w lepszej organizacji dokumentów HTML. Dzięki nim, przeglądarki i roboty wyszukiwarek mogą lepiej zrozumieć strukturę stron. Na przykład, <header> to nagłówek strony lub sekcji, <nav> tworzy menu nawigacyjne, a <footer> to stopka. Myślę, że to super sprawa, bo poprawia dostępność strony i jej SEO, bo tak naprawdę pomaga wyszukiwarkom w lepszym indeksowaniu treści, co może prowadzić do lepszych wyników w wyszukiwarkach. Dodatkowo, HTML5 ma też inne ciekawe nowinki, jak wsparcie dla multimediów, lokalne przechowywanie danych, a także lepszą kompatybilność z aplikacjami mobilnymi, więc zdecydowanie warto go wykorzystywać do budowy stron internetowych.

Pytanie 36

Kolor zaprezentowany na ilustracji, zapisany w modelu RGB, w formacie szesnastkowym będzie określony w następujący sposób

A. 71A0B2

B. 77A1C1

C. 76A3C1

D. 77A0C1

Błędne odpowiedzi wynikają z niepoprawnej konwersji wartości RGB na zapis szesnastkowy. Przy konwersji kolorów z modelu RGB na system szesnastkowy kluczowe jest poprawne przeliczenie każdej z trzech składowych: czerwonego zielonego i niebieskiego. Wartości te w modelu RGB wahają się od 0 do 255 co w systemie szesnastkowym odpowiada wartościom od 00 do FF. Niewłaściwe zrozumienie tego procesu prowadzi do błędnych wyników. W przykładzie wartość 119 dla czerwonego należy przeliczyć na 77 w systemie szesnastkowym. Podobnie 160 dla zielonego konwertuje się na A0 a 193 dla niebieskiego na C1. Powszechny błąd polega na pomyleniu wartości dziesiętnych z ich odpowiednikami szesnastkowymi bądź na niepoprawnym zaokrąglaniu podczas konwersji. Innym częstym błędem jest niepoprawne zrozumienie znaczenia kolejności zapisu gdzie każda para znaków odpowiada jednej składowej RGB. Aby uniknąć takich błędów warto korzystać z kalkulatorów konwersji lub narzędzi graficznych które automatycznie dokonują prawidłowej zamiany co jest zgodne z dobrymi praktykami projektowymi. Znajomość tych zasad jest kluczowa w pracy z grafiką komputerową i web designem gdzie precyzja w odwzorowaniu kolorów ma ogromne znaczenie dla ostatecznego wyglądu projektu.

Pytanie 37

Stronę internetową zapisano w języku XHTML. Który z kodów stanowi implementację przedstawionego fragmentu strony, jeżeli żadne style CSS nie zostały zdefiniowane?

Początki HTML

W 1980 fizyk Tim Berners-Lee, pracownik CERN,
stworzył prototyp hipertekstowego systemu informacyjnego – ENQUIRE

<b>Początki HTML</b>
<p>W 1980 fizyk <b>Tim Berners-Lee</b>, pracownik <i>CERN</i>,<br /> stworzył
<b>prototyp hipertekstowego systemu informacyjnego – <i>ENQUIRE</i></b></p>

<h1>Początki HTML</h1>
<p>W 1980 fizyk <b>Tim Berners-Lee</b>, pracownik <i>CERN</i>,<br /> stworzył
<b>prototyp hipertekstowego systemu informacyjnego – <i>ENQUIRE</i></b></p>

<b>Początki HTML</b>
<p>W 1980 fizyk <b>Tim Berners-Lee</b>, pracownik <i>CERN</i>,<hr /> stworzył
<b>prototyp hipertekstowego systemu informacyjnego – <i>ENQUIRE</i></b></p>

<h1>Początki HTML</h1>
<p>W 1980 fizyk <b>Tim Berners-Lee</b>, pracownik <i>CERN</i>,<br /> stworzył
<i>prototyp hipertekstowego systemu informacyjnego – <b>ENQUIRE</b></i></p>

A. D.

B. A.

C. C.

D. B.

Twoja odpowiedź jest poprawna. Wybrałeś opcję B, która przedstawiała poprawną implementację fragmentu strony internetowej napisanej w języku XHTML. W tym fragmencie wykorzystane zostały standardowe tagi XHTML, takie jak <h1> do oznaczenia nagłówka pierwszego poziomu oraz <p> do definiowania akapitu. Dodatkowo w tekście użyte zostały tagi <b> i <i> do odpowiednio pogrubienia i kursywy, co podkreśla ważność wybranych fragmentów tekstu. Tag <br /> pozwala na stworzenie przerwy wiersza, co jest szczególnie użyteczne w przypadku długich akapitów tekstu. Pamiętaj, że XHTML jest bardziej rygorystyczną wersją HTML i wymaga zawsze domknięcia tagów. Wiedza na ten temat jest niezwykle ważna podczas tworzenia stron internetowych, a standardy i dobre praktyki branżowe pomagają w utrzymaniu kodu w czytelnej i zrozumiałej formie.

Pytanie 38

Jakie polecenie HTML powinno być zastosowane, aby sformatować akapit tekstu?

Tekst może być zaznaczony albo istotny dla autora

A. <p>Tekst może być <mark>zaznaczony albo <em>istotny</em> dla autora</mark></p>

B. <p>Tekst może być <mark>zaznaczony</mark> albo <em>istotny dla autora</p>

C. <p>Tekst może być <mark>zaznaczony albo <i>istotny</i> dla autora</mark></p>

D. <p>Tekst może być <mark>zaznaczony</mark> albo <em>istotny</em> dla autora</p>

Odpowiedź druga jest prawidłowa, ponieważ stosuje poprawną składnię HTML do oznaczenia fragmentów tekstu z różnym formatowaniem. Element <p> służy do definiowania paragrafu, w którym tekst jest umieszczony. Element <mark> używany jest do oznaczania tekstu, który powinien być zwrócony uwagę czytelnika, poprzez podkreślenie go kolorem tła. Z kolei <em> jest przeznaczony do oznaczenia tekstu, który ma zostać wyróżniony jako istotny, zazwyczaj poprzez użycie kursywy. Użycie tych elementów w połączeniu z zamykającymi tagami, jak w odpowiedzi drugiej, jest zgodne z zaleceniami standardów HTML5, które kładą nacisk na semantyczne znaczenie znaczników. To podejście wspiera dostępność oraz SEO, ponieważ pomaga czytnikom ekranowym i wyszukiwarkom lepiej zrozumieć strukturę i znaczenie treści. Praktyczne zastosowanie tych znaczników można zobaczyć na stronach internetowych, gdzie kluczowe informacje muszą być odpowiednio wyróżnione, aby poprawić doświadczenie użytkownika i przekazać istotne dane w czytelny sposób.

Pytanie 39

Znacznik <ins> w języku HTML jest używany do wskazania

A. tekstu, który został dodany

B. tekstu, który został usunięty

C. cytowanego fragmentu tekstu

D. tekstu o zmienionym formacie

Odpowiedzi dotyczące oznaczania cytowanego bloku tekstu, tekstu przeformatowanego oraz tekstu, który został usunięty, nie są poprawne w kontekście znacznika <ins>. Znacznik używany do cytowania tekstu to <blockquote>, który służy do wyodrębnienia dłuższych cytatów, zazwyczaj z innymi źródłami. Z kolei do oznaczania tekstu, który został usunięty, stosuje się znacznik <del>, który wskazuje na treść, która została usunięta z dokumentu, co jest sprzeczne z funkcją <ins>. Oznaczenie tekstu przeformatowanego nie ma związku z tagiem, ponieważ nie ma on bezpośredniego związku z formatowaniem; formatowanie tekstu odbywa się przy użyciu znaczników takich jak <strong> lub <em>, które nadają różne style wizualne, ale nie zmieniają semantyki tekstu. W związku z tym, wszystkie te niepoprawne odpowiedzi dotyczą różnych aspektów zarządzania treścią w HTML, ale nie są związane z oznaczaniem tekstu dodanego, co jest kluczowym zastosowaniem znacznika <ins>. Zrozumienie różnic między tymi znacznikami jest istotne, aby poprawnie stosować HTML w praktyce oraz zapewniać jasność i dostępność treści w sieci.

Pytanie 40

Wskaż kod CSS odpowiadający układowi bloków 2 - 5, zakładając, że są one zbudowane w oparciu o przedstawiony kod HTML.

BLOK 1
BLOK 2	BLOK 3	BLOK 4
BLOK 5

<div id="pierwszy">BLOK 1</div>
<div id="drugi">BLOK 2</div>
<div id="trzeci">BLOK 3</div>
<div id="czwarty">BLOK 4</div>
<div id="piaty">BLOK 5</div>

Kod 1.
#drugi {
  float: left;
  width: 40%;
}
#trzeci {
  float: left;
  width: 30%;
}
#czwarty {
  float: right;
  width: 30%;
}
#piaty {
  clear: both;
  width: 30%;
}

Kod 2.
#drugi {
  float: left;
  width: 40%;
}
#trzeci {
  float: left;
  width: 30%;
}
#czwarty {
  float: right;
  width: 30%;
}
#piaty {
  float: left;
  width: 30%;
}

Kod 3.
#drugi {
  float: left;
  width: 40%;
}
#trzeci {
  float: left;
  width: 30%;
}
#czwarty {
  width: 30%;
}
#piaty {
  float: right;
  width: 30%;
}

Kod 4.
#drugi {
  float: left;
  width: 40%;
}
#trzeci {
  width: 30%;
}
#czwarty {
  width: 30%;
}
#piaty {
  float: right;
  width: 30%;
}

A. Kod 2.

B. Kod 4.

C. Kod 3.

D. Kod 1.

Niestety, twoja odpowiedź jest niepoprawna. Wybrałeś odpowiedź niezgodną z przedstawionym układem bloków. Analizując kod CSS, musisz zwrócić uwagę na różne aspekty, takie jak pozycja, szerokość i kolejność bloków. W tym przypadku, blok 'drugi' powinien być umieszczony po lewej stronie i zajmować 40% szerokości, bloki 'trzeci' i 'czwarty' powinny być odpowiednio po lewej i prawej stronie z szerokością 30%, a blok 'piąty' powinien być umieszczony na dole i zajmować 30% szerokości. To wszystko odpowiada układowi bloków na diagramie. Jeżeli wybrałeś inny kod, to prawdopodobnie źle zinterpretowałeś pozycję lub szerokość bloków, co jest kluczowe w tworzeniu układów stron. Ważne jest, aby zrozumieć i umieć manipulować kodem CSS, aby uzyskać pożądany układ strony. Pamiętaj, że praktyka i doświadczenie są kluczowe do zrozumienia jak kod CSS wpływa na układ i stylizację elementów strony.

Rozpocznij nowy egzamin

Powrót do strony głównej