Wyniki egzaminu

Informacje o egzaminie:
  • Zawód: Technik programista
  • Kwalifikacja: INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych
  • Data rozpoczęcia: 8 czerwca 2026 09:48
  • Data zakończenia: 8 czerwca 2026 09:50

Egzamin niezdany

Wynik: 0/40 punktów (0,0%)

Wymagane minimum: 20 punktów (50%)

Nowe
Analiza przebiegu egzaminu- sprawdź jak rozwiązywałeś pytania
Udostępnij swój wynik
Szczegółowe wyniki:
Pytanie 1

Którą właściwość CSS należy zastosować, aby uzyskać efekt rozstrzelenia (zwiększonych odstępów) między literami?

A.
text-decoration
B.
letter-spacing
C.
letter-transform
D.
text-space
Pozostałe nazwy albo nie istnieją, albo robią coś innego. letter-transform i text-space brzmią logicznie, ale takich właściwości w CSS nie ma. text-decoration jest prawdziwa, lecz odpowiada za dekoracje tekstu, takie jak podkreślenie czy przekreślenie, a nie za odstępy między znakami. Rozstrzelenie liter uzyskuje się właściwością letter-spacing, dlatego to ona jest poprawna.

Pytanie 2

Reprezentacja znacznika HTML w formacie

<a href="#hobby">przejdź</a>
A. jest błędny, w atrybucie href należy wpisać adres URL
B. jest błędny, użyto niewłaściwego znaku "#" w atrybucie href
C. jest poprawny, po kliknięciu w odnośnik strona zostanie przewinięta do sekcji o nazwie "hobby"
D. jest poprawny, po kliknięciu w odnośnik otworzy się strona internetowa o URL "hobby"
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 3

Język HTML posiada nagłówki, które służą do tworzenia hierarchii treści. Nagłówki te występują tylko w zakresie

A. h1 – h8
B. h1 – h4
C. h1 – h10
D. h1 – h6

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź h1 – h6 jest poprawna, ponieważ język HTML udostępnia sześć poziomów nagłówków, od h1 do h6, które służą do tworzenia hierarchii treści na stronie internetowej. Nagłówek h1 jest najważniejszy i powinien być używany do oznaczenia głównego tytułu strony, podczas gdy h2, h3, h4, h5 i h6 wskazują na kolejne poziomy nagłówków, które pomagają w organizacji treści. Przykładowo, nagłówek h2 może być używany do sekcji, natomiast h3 może oznaczać podsekcje w ramach danej sekcji. Używanie nagłówków w ten sposób nie tylko poprawia czytelność i zrozumienie treści przez użytkowników, ale także pozytywnie wpływa na SEO (optymalizację dla wyszukiwarek). Warto pamiętać, że zgodnie z najlepszymi praktykami, powinno się unikać pomijania poziomów nagłówków, co zapewnia logiczną strukturę treści i ułatwia indeksację przez roboty wyszukiwarek.

Pytanie 4

Efekt przedstawiony w filmie powinien być zdefiniowany w selektorze

A. tr { background-color: Pink; }
B. tr:active { background-color: Pink; }
C. td, th { background-color: Pink; }
D. tr:hover { background-color: Pink; }

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
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 5

Skrypt na stronę WWW stworzony w języku PHP

A. może działać bez wsparcia serwera WWW
B. jest wykonywany po stronie serwera
C. jest realizowany po stronie klienta
D. jest przetwarzany w taki sam sposób jak JavaScript

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Kod PHP jest przetwarzany po stronie serwera, co oznacza, że wszystkie instrukcje napisane w tym języku są wykonywane na serwerze, a nie na komputerze klienta. Kiedy użytkownik żąda strony internetowej, serwer WWW interpretuje kod PHP, generuje odpowiedni HTML i wysyła go do przeglądarki. Dzięki temu możliwe jest dynamiczne tworzenie treści, uzależnionej od danych wejściowych użytkownika czy zawartości bazy danych. Przykładowo, w aplikacjach internetowych takich jak systemy zarządzania treścią (CMS) czy platformy e-commerce, PHP pozwala na generowanie różnorodnych widoków i interakcji w oparciu o aktualne informacje. Kluczowym aspektem dobrej praktyki w programowaniu w PHP jest separacja logiki aplikacji od warstwy prezentacji, co wspiera łatwiejsze zarządzanie kodem i jego utrzymanie. Warto również zaznaczyć, że PHP współpracuje z różnymi systemami baz danych, co umożliwia przechowywanie i przetwarzanie dużych ilości danych. Na przykład, w typowej aplikacji webowej można wykorzystać PHP do komunikacji z bazą MySQL, co pozwala na dynamiczne ładowanie treści w odpowiedzi na interakcje użytkownika.

Pytanie 6

W języku HTML, aby uzyskać efekt podobny do tego w przykładzie, trzeba użyć konstrukcji

Ilustracja do pytania
A. <p><strike>Duży tekst zwykły tekst</p>
B. <p><big>Duży tekst</big> zwykły tekst</p>
C. <p><big>Duży tekst</p> zwykły tekst
D. <p><strike>Duży tekst</strike> zwykły tekst</p>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź jest prawidłowa, ponieważ w języku HTML, aby zwiększyć rozmiar czcionki dla części tekstu, można użyć znacznika <big>. Znacznik ten powoduje, że tekst wewnątrz jest wyświetlany w większym rozmiarze niż tekst otaczający. Jest to przydatne w sytuacjach, gdy chcemy wyróżnić część tekstu bez stosowania zaawansowanego stylu CSS. Chociaż <big> jest uznawany za przestarzały w nowoczesnym HTML, dla celów edukacyjnych i zgodności z starszymi dokumentami HTML wciąż może być stosowany. Praktyką zalecaną w aktualnych standardach jest używanie stylów CSS, np. poprzez przypisanie klasy lub bezpośrednie stylowanie in-line. Warto zaznaczyć, że stosowanie <big> nie jest zalecane w nowych projektach, ponieważ CSS oferuje większą elastyczność i kontrolę nad wyglądem tekstu. Niemniej jednak, znajomość takich znaczników jak <big> pomaga w zrozumieniu, jak rozwijał się HTML i jakie są różnice między starszymi a nowoczesnymi metodami formatowania tekstu.

Pytanie 7

Który znacznik lub zestaw znaczników nie jest używany do określenia struktury dokumentu HTML?

A. <section>
B. <i>, <b>, <u>
C. <header>, <footer>
D. <div>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Te znaczniki, czyli <i>, <b> i <u>, nie są jakby do tworzenia struktury dokumentu HTML, ale bardziej do formatowania tekstu. Zgodnie z nowymi standardami HTML5, są to elementy semantyczne, które wpływają na to, jak coś wygląda, a nie na to, jak jest zorganizowane. Znacznik <i> używamy, jak chcemy coś napisać kursywą, <b>, żeby coś podkreślić, a <u>, żeby coś podkreślić. Często korzysta się z nich w stylach CSS, ale nie nadają one hierarchii ani kontekstu dokumentu. Jak chcesz wyróżnić jakiś tekst w kontekście kodu czy tytułu rozdziału, lepiej skorzystać z bardziej semantycznych znaczników, jak <em> dla podkreślenia znaczenia albo <strong> dla podkreślenia wagi. W czasach, kiedy dostępność i SEO są coraz ważniejsze, używanie semantycznych elementów to klucz do tworzenia lepszych i bardziej przejrzystych stron.

Pytanie 8

Podczas przygotowywania grafiki na stronę internetową konieczne jest wycięcie jedynie określonego fragmentu. Jak nazywa się ta operacja?

A. kadrowanie.
B. lustrzane odbicie obrazu.
C. łączenie warstw.
D. zmiana rozmiaru.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Kadrowanie to proces polegający na wycinaniu fragmentu obrazu w celu skupienia uwagi na określonym elemencie lub poprawienia kompozycji. W kontekście grafiki internetowej, kadrowanie jest kluczowe, aby dostosować zdjęcia do wymagań wizualnych strony, zachowując jednocześnie wysoką jakość obrazu. Przykładowo, jeśli tworzymy stronę dla restauracji, możemy wyciąć fragment zdjęcia dania, aby lepiej zaprezentować jego szczegóły. Dobre praktyki w kadrowaniu obejmują stosowanie zasady trzech, która polega na umiejscowieniu kluczowych elementów obrazu w punktach przecięcia linii podziału. Warto również pamiętać o rozdzielczości i proporcjach, aby uniknąć rozmycia lub zniekształcenia obrazu. Kadrowanie jest często używane w różnych formatach wizualnych, takich jak posty w mediach społecznościowych, banery reklamowe czy galerie zdjęć. W ten sposób, odpowiednie kadrowanie przyczynia się do lepszej prezentacji treści oraz poprawia estetykę i przejrzystość strony internetowej.

Pytanie 9

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 2BLOK 3BLOK 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 4.
B. Kod 2.
C. Kod 3.
D. Kod 1.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Brawo, twoja odpowiedź jest poprawna. Wybrałeś Kod 2, co jest zgodne z układem bloków na diagramie. Przy analizie kodu CSS, musimy zwrócić uwagę na różne aspekty, takie jak pozycja, szerokość i kolejność bloków. W tym przypadku, blok o id 'drugi' jest umieszczony po lewej stronie i zajmuje 40% szerokości, co jest zgodne z diagramem. Bloki 'trzeci' i 'czwarty' są odpowiednio po lewej i prawej stronie z szerokością 30%, a blok 'piąty' jest umieszczony na dole i zajmuje 30% szerokości. To wszystko odpowiada układowi bloków na diagramie. Kiedy tworzysz strony internetowe, 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.

Pytanie 10

Które z formatowań nie jest wyrażone w języku CSS?

A. Fragment pliku strona.html:
<style>
body { background-color: yellow; }
</style>
B. Fragment pliku formatowanie.css:
body { background-color: yellow; }
C. Fragment pliku strona.html:
<body bgcolor="yellow">
D. Fragment pliku strona.html:
<body style="background-color: yellow;" >
A. D.
B. B.
C. A.
D. C.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Gratulacje, prawidłowo wybrałeś odpowiedź C. To pytanie dotyczyło zrozumienia, które formatowania nie są wyrażone w języku CSS. W CSS wykorzystuje się różnego rodzaju selektory, aby określić elementy strony, do których mają być stosowane określone style. Fragmenty A i B przedstawiają formatowanie w języku CSS. Fragment A demonstruje styl wewnątrz dokumentu HTML, co jest jednym z trzech sposobów dodawania styli CSS do dokumentu HTML. Natomiast fragment B pokazuje styl z zewnętrznego pliku CSS, co jest zgodne ze standardami i uważane za najlepszą praktykę, ponieważ pozwala na utrzymanie oddzielenia struktury i prezentacji. Fragment D również wykorzystuje CSS, ale jest to tzw. "inline CSS", który jest stosowany bezpośrednio do elementu HTML. Ostatecznie, jedynie fragment C nie używa CSS. Zamiast tego, wykorzystuje przestarzały atrybut HTML "bgcolor" do określenia koloru tła, co obecnie jest uważane za złą praktykę. Pamiętaj, że zrozumienie różnicy pomiędzy HTML a CSS jest kluczowe w budowaniu poprawnie działających i dobrze zaprojektowanych stron internetowych.

Pytanie 11

W dokumencie HTML umieszczono tekst sformatowany określonym stylem. Aby dodać do tego tekstu kilka słów sformatowanych innym stylem, należy użyć znacznika

A. <section>
B. <span>
C. <hr>
D. <table>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
<span> jest znacznikiem HTML, który służy do stosowania stylów CSS do określonych fragmentów tekstu w obrębie bloków HTML. Umożliwia on formatowanie tekstu w bardziej lokalny sposób, co jest niezwykle przydatne, gdy chcemy wyróżnić niektóre słowa lub frazy w dłuższym akapicie. W odróżnieniu od znaczników takich jak <div>, które są stosowane do większych sekcji, <span> działa na poziomie inline, co oznacza, że nie wprowadza nowego bloku w układzie strony. Przykład użycia tej etykiety może wyglądać następująco: <p>W tym akapicie <span style='color:red;'>ważne słowo</span> jest wyróżnione kolorem czerwonym.</p>. Dzięki temu możemy łatwo zastosować różnorodne style, takie jak zmiana koloru czcionki, czcionki, tła lub nawet dodawanie efektów animacyjnych do konkretnego fragmentu tekstu. Zgodnie z standardami W3C, <span> jest zalecanym sposobem na selektywne formatowanie tekstu, co czyni go niezwykle praktycznym narzędziem w tworzeniu elastycznych i atrakcyjnych wizualnie stron internetowych.

Pytanie 12

Wskaż styl CSS za pomocą, którego uzyskano przedstawiony efekt

Styl 1.
img {
  width: 100px;
  border-radius: 10%;
}
Styl 2.
img {
  width: 100px;
  border-radius: 50px;
}
Styl 3.
img {
  width: 100px;
  border: 50% green;
}
Styl 4.
img {
  width: 100px;
  shape: circle;
}
Ilustracja do pytania
A. Styl 2.
B. Styl 1.
C. Styl 3.
D. Styl 4.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Dobrze! Wybrałeś właściwą odpowiedź, która jest 'Styl 2.'. Ten styl CSS składa się z właściwości border-radius z wartością 50px. Właściwość border-radius jest używana do zaokrąglania rogów elementu. Wartość tej właściwości może być ustawiona na dowolną liczbę pikseli, a w tym przypadku ustawiona jest na 50px, co daje efekt widoczny na obrazie. Jest to ważna cecha w CSS, ponieważ pozwala na dodanie subtelnego zaokrąglenia do elementów na stronie internetowej, co może zdecydowanie poprawić jej wygląd. Pamiętaj, że dobre praktyki projektowania stron internetowych polegają na wykorzystywaniu tej właściwości z umiarem, aby uniknąć przekombinowania i utraty profesjonalizmu strony.

Pytanie 13

W tabeli pokazano cechy pliku graficznego. Aby rysunek ładował się szybciej na stronie WWW, należy

Wymiary: 4272 x 2848px
Rozdzielczość: 72 dpi
Format: JPG
A. zwiększyć rozdzielczość
B. zmniejszyć wymiary rysunku
C. zmienić format grafiki na CDR
D. zmienić proporcje szerokości do wysokości

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Zmniejszenie wymiarów rysunku to kluczowy krok w optymalizacji czasu ładowania grafiki na stronę WWW. Mniejsze wymiary oznaczają mniejszą ilość danych do przesłania, co skraca czas ładowania strony. Praktycznym przykładem jest zmniejszenie wymiarów obrazu z 4272 x 2848 pikseli do bardziej standardowego rozmiaru, jak np. 1920 x 1080 pikseli dla grafik wyświetlanych na ekranach. Zmniejszenie wymiarów nie tylko przyspiesza ładowanie ale także zmniejsza zużycie transferu danych co jest istotne przy ograniczeniach mobilnych. Warto pamiętać że mniejsze grafiki są też mniej zasobożerne dla urządzeń użytkowników co wpływa na ogólną wydajność strony. Zastosowanie odpowiednich wymiarów jest zgodne z dobrymi praktykami optymalizacji webowej rekomendowanymi przez Google PageSpeed Insights i inne narzędzia analityczne. Optymalizacja grafiki poprzez zmniejszenie jej wymiarów jest podstawową czynnością w procesie tworzenia responsywnych i szybko działających witryn internetowych.

Pytanie 14

W formularzu HTML użyto znacznika <input>. Pole to będzie służyło do wprowadzania maksymalnie

<input type="password" size="30" maxlength="20">
A. 30 znaków, które nie są widoczne w polu tekstowym
B. 20 znaków, które są widoczne w trakcie wprowadzania
C. 20 znaków, które nie są widoczne w polu tekstowym
D. 30 znaków, które są widoczne w trakcie wprowadzania

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Poprawna odpowiedź to 20 znaków, które nie są widoczne w polu tekstowym. Znacznik <input type="password"> w HTML jest używany do tworzenia pól wprowadzania, w których hasła lub inne wrażliwe dane są maskowane, co oznacza, że wpisywane znaki są pokazywane jako symbole, zwykle kropki. W atrybucie 'maxlength' określa się maksymalną liczbę znaków, które użytkownik może wprowadzić. W tym przypadku, atrybut 'maxlength="20"' oznacza, że użytkownik może wprowadzić maksymalnie 20 znaków, ale nie będą one widoczne w polu tekstowym, co zwiększa bezpieczeństwo. Dobrym przykładem zastosowania tego typu pola jest logowanie do systemów, gdzie ochrona danych użytkownika jest kluczowa. Stosowanie pól typu 'password' jest zgodne z zasadami ochrony prywatności i dobrymi praktykami w zakresie projektowania interfejsów użytkownika, które wymagają maskowania danych w celu minimalizacji ryzyka ich ujawnienia.

Pytanie 15

Aby poprawnie zdefiniować hierarchiczną strukturę tekstu na stronie internetowej, należy zastosować:

A. znacznik <div>
B. znaczniki <frame> i <table>
C. znaczniki <h1>, <h2> oraz <p>
D. znacznik <p> z formatowaniem

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Hierarchię tekstu na stronie budują znaczniki nagłówków <code><span class="code-text">&lt;</span><span class="code-keyword">h1</span><span class="code-text">&gt;</span></code> do <code><span class="code-text">&lt;</span><span class="code-keyword">h6</span><span class="code-text">&gt;</span></code>, gdzie <code><span class="code-text">&lt;</span><span class="code-keyword">h1</span><span class="code-text">&gt;</span></code> to tytuł najważniejszy, a kolejne poziomy oznaczają sekcje i podsekcje. Przeglądarka, wyszukiwarki i czytniki ekranu odczytują z nich plan dokumentu, dlatego nagłówków używa się zgodnie ze znaczeniem, a nie dla samego wyglądu. Akapity <code><span class="code-text">&lt;</span><span class="code-keyword">p</span><span class="code-text">&gt;</span></code> uzupełniają tę strukturę właściwą treścią. Taki układ poprawia czytelność, dostępność i pozycjonowanie strony - i właśnie dlatego poprawna odpowiedź łączy nagłówki z akapitem.

Pytanie 16

W kodzie HTML zdefiniowano formularz, który wysyła dane do pliku formularz.php. Po naciśnięciu przycisku typu submit przeglądarka przechodzi do poniższego adresu:

../formularz.php?imie=Anna&nazwisko=Kowalska
Na podstawie podanego adresu można stwierdzić, że dane do pliku formularz.php zostały przesłane metodą:
A. SESSION
B. COOKIE
C. POST
D. GET

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Twoja odpowiedź jest prawidłowa. Dane do pliku formularz.php zostały przesłane metodą GET, co można stwierdzić na podstawie adresu URL, który zawiera parametry (imię=Anna&nazwisko=Kowalska) przekazane po znaku zapytania (?). W metodzie GET, parametry są dołączane do adresu URL i są widoczne w pasku adresu przeglądarki. Jest to uniwersalny sposób przesyłania danych, który jest zgodny ze standardem HTTP i jest szeroko stosowany w praktyce. Metoda GET jest najprostszym sposobem przesyłania danych, ale ze względu na widoczność parametrów w adresie URL, nie jest zalecana do przesyłania ważnych informacji, takich jak hasła. W praktyce, metoda GET jest często stosowana do przekazywania informacji niezbędnych do wygenerowania konkretnej strony, takich jak identyfikatory zasobów lub parametry filtrowania.

Pytanie 17

W CSS zapis w postaci

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

spowoduje, że kolor czerwony zostanie zastosowany do

A. tekstu nagłówka w pierwszym stopniu
B. pierwszej litery nagłówka w drugim stopniu
C. pierwszej litery nagłówka w pierwszym stopniu
D. pierwszej linii akapitu

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
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 18

Który z podanych formatów pozwala na zapis zarówno dźwięku, jak i obrazu?

A. PNG
B. MP3
C. WAV
D. MP4

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Format MP4, znany również jako MPEG-4 Part 14, jest jednym z najpopularniejszych formatów multimedialnych, który umożliwia jednoczesny zapis zarówno dźwięku, jak i obrazu. Dzięki zastosowaniu zaawansowanej kompresji, MP4 pozwala na przechowywanie wysokiej jakości materiałów w stosunkowo małych plikach, co czyni go idealnym do przesyłania i strumieniowania w Internecie. MP4 obsługuje wiele kodeków, takich jak H.264 dla wideo oraz AAC dla dźwięku, co pozwala na szeroką kompatybilność z różnymi urządzeniami, od smartfonów po odtwarzacze multimedialne. Format ten jest zgodny z wieloma standardami, co czyni go wszechstronnym wyborem dla twórców treści. Przykłady jego zastosowania obejmują filmy wideo na platformach streamingowych, klipy muzyczne i wideoklipy. Dzięki swoim zaletom, MP4 stał się de facto standardem w przemyśle multimedialnym, co w znacznym stopniu przyczyniło się do jego popularności oraz wszechstronności.

Pytanie 19

Aby umieścić kod JavaScript bezpośrednio w dokumencie HTML, należy użyć znacznika:

A.
<script>
B.
<code>
C.
<style>
D.
<js>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Kod JavaScript osadza się w dokumencie wewnątrz znacznika <code><span class="code-text">&lt;</span><span class="code-keyword">script</span><span class="code-text">&gt;</span></code>. Wszystko między <code><span class="code-text">&lt;</span><span class="code-keyword">script</span><span class="code-text">&gt;</span></code> a <code><span class="code-text">&lt;/</span><span class="code-keyword">script</span><span class="code-text">&gt;</span></code> przeglądarka traktuje jako kod do wykonania. Tym samym znacznikiem (z atrybutem <code><span class="code-variable">src</span></code>) dołącza się też skrypty zewnętrzne. Dlatego do umieszczenia JS w stronie służy <code><span class="code-text">&lt;</span><span class="code-keyword">script</span><span class="code-text">&gt;</span></code>.

Pytanie 20

W znaczniku meta w miejsce kropek należy wpisać

<meta name="description" content="…">
A. język dokumentu.
B. nazwę edytora.
C. informację o dostosowaniu do urządzeń mobilnych.
D. streszczenie treści strony.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
W meta tagu, w polu 'content' powinno być streszczenie tego, co jest na stronie. To bardzo ważne dla SEO, czyli optymalizacji strony pod kątem wyszukiwarek. Taki opis pojawia się w wynikach wyszukiwania, co wpływa na to, jak użytkownicy postrzegają stronę i czy klikną w link. Fajnie by było, gdyby był krótki, zrozumiały i zawierał ważne słowa kluczowe dotyczące tematu strony. Na przykład, jeśli strona jest o zdrowym jedzeniu, można napisać coś w stylu: 'Poradnik zdrowego odżywiania z przepisami i wskazówkami na lepszy styl życia'. Użycie tych znaczników meta zgodnie z zaleceniami Google i innych wyszukiwarek zwiększa szansę, że strona będzie lepiej widoczna w sieci. Dlatego dobrze, żeby używać tego znacznika w odpowiedni sposób, bo to naprawdę pomaga w poprawie widoczności strony w internecie.

Pytanie 21

W JavaScript metoda getElementById odnosi się do

A. znacznika HTML o podanej nazwie klasy
B. zmiennej numerycznej
C. klasy zdefiniowanej w CSS
D. znacznika HTML o wskazanym id

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Metoda getElementById w JavaScript jest kluczowym narzędziem do interakcji z modelowaniem DOM (Document Object Model). Służy do uzyskiwania dostępu do pojedynczego elementu HTML na podstawie jego atrybutu id, co jest zgodne z zasadą unikalności identyfikatorów w dokumencie HTML. Dzięki temu programiści mogą stosunkowo łatwo manipulować pojedynczymi elementami, co jest istotne w dynamicznych aplikacjach internetowych. Przykładem zastosowania tej metody może być zmiana tekstu w elemencie <h1>, gdzie używamy getElementById('myHeader').innerHTML = 'Nowy nagłówek';. Zgodnie z dobrymi praktykami, powinno się unikać używania zduplikowanych id w dokumencie, aby zapewnić, że metoda ta zawsze zwraca jeden, a nie wiele elementów. Warto również pamiętać, że w przypadku braku elementu o podanym id, metoda zwróci null, co powinno być uwzględnione w logice aplikacji, aby uniknąć błędów. Użycie tej metody jest standardem w programowaniu JavaScript i stanowi fundament dla wielu bardziej zaawansowanych technik manipulacji DOM.

Pytanie 22

W formularzu umieszczono kontrolki do podania imienia oraz nazwiska. Który z atrybutów odpowiada za wyświetlanie sugestii w polu kontrolki, która znika, gdy użytkownik zaczyna wpisywanie wartości?

<label for="imie">Imię: </label> 
<input id="imie" value="Wpisz dane" title="Wpisz imię"><br>
<label for="nazw">Nazwisko: </label>
<input id="nazw" placeholder="Wpisz dane" title="Wpisz nazwisko">
A. value
B. title
C. placeholder
D. for

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Atrybut "placeholder" jest kluczowym elementem w formularzach HTML, który definiuje tekst podpowiedzi umieszczony w polu kontrolki. Tekst ten zniknie, gdy użytkownik zacznie wpisywać dane, co pozwala na zapewnienie bardziej intuicyjnego interfejsu. W przypadku przykładowego formularza, atrybut "placeholder" jest użyty w polu nazwiska, co stanowi doskonały przykład jego praktycznego zastosowania. Dobrą praktyką jest stosowanie atrybutu "placeholder" w formularzach, ponieważ wprowadza on klarowność i ułatwia użytkownikom wypełnianie formularzy, jednocześnie zmniejszając ryzyko błędów. Atrybut ten nie tylko poprawia doświadczenia użytkownika, ale także zwiększa dostępność formularzy, ponieważ pozwala osobom korzystającym z czytników ekranu lepiej zrozumieć, jakie dane są wymagane. Warto również zauważyć, że "placeholder" nie powinien być używany jako substytut etykiety, która jest niezbędna do poprawnej dostępności i użyteczności. Etykiety powinny być zawsze stosowane, a "placeholder" powinien pełnić jedynie funkcję pomocniczą.

Pytanie 23

Walidator W3C zgłosił błąd o niezamkniętych elementach przy zamykającym <p>. Którego fragmentu dotyczy?

A.
<p>Ala ma <b>kota</b></p>
B.
<p>Ala ma kota
C.
<p>Ala ma <b>kota</p></b>
D.
<p>Ala ma kota</p>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Znaczniki trzeba zamykać w ODWROTNEJ kolejności niż otwierano. W <code><span class="code-text">&lt;</span><span class="code-variable">p</span><span class="code-text">&gt;</span><span class="code-variable">Ala</span> <span class="code-variable">ma</span> <span class="code-text">&lt;</span><span class="code-variable">b</span><span class="code-text">&gt;</span><span class="code-variable">kota</span><span class="code-text">&lt;</span><span class="code-text">/</span><span class="code-variable">p</span><span class="code-text">&gt;</span><span class="code-text">&lt;</span><span class="code-text">/</span><span class="code-variable">b</span><span class="code-text">&gt;</span></code> <code><span class="code-text">&lt;</span><span class="code-keyword">b</span><span class="code-text">&gt;</span></code> otwarto wewnątrz <code><span class="code-text">&lt;</span><span class="code-keyword">p</span><span class="code-text">&gt;</span></code>, ale <code><span class="code-text">&lt;</span><span class="code-keyword">p</span><span class="code-text">&gt;</span></code> zamknięto przed <code><span class="code-text">&lt;</span><span class="code-keyword">b</span><span class="code-text">&gt;</span></code> - tagi się krzyżują, dlatego walidator zgłasza błąd. Dlatego chodzi o ten fragment.

Pytanie 24

Elementy <header>, <article>, <section>, <footer> są typowe dla języka

A. XHTML 1.1
B. HTML 5
C. HTML 4.01 Transitional
D. HTML 4.01 Strict

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź HTML 5 jest prawidłowa, ponieważ to właśnie w tej wersji języka HTML wprowadzono nowe semantyczne znaczniki, takie jak <header>, <article>, <section> oraz <footer>. Te znaczniki mają na celu lepsze strukturalne organizowanie treści w dokumentach internetowych, co ułatwia zarówno odczyt zrozumienia przez przeglądarki, jak i poprawia dostępność dla osób korzystających z technologii wspomagających. Na przykład, <header> zazwyczaj zawiera nagłówki i elementy nawigacyjne, podczas gdy <article> służy do oznaczenia niezależnej jednostki treści, np. artykułu prasowego. <section> jest używane do grupowania powiązanych sekcji, a <footer> zawiera informacje takie jak prawa autorskie czy linki do polityki prywatności. Wdrożenie tych znaczników zgodnie z najlepszymi praktykami zwiększa semantykę strony, co jest korzystne dla SEO, a także pozwala na lepsze zrozumienie struktury strony przez roboty indeksujące. HTML 5 jest obecnie standardem w tworzeniu stron internetowych i jego znajomość jest kluczowa dla współczesnych deweloperów.

Pytanie 25

Na czym polega walidacja strony internetowej?

A. na sprawdzeniu jej w celu wykrycia i usunięcia błędów
B. na działaniach zwiększających liczbę odwiedzin
C. na udostępnieniu jej w Internecie
D. na reklamie strony

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Walidacja strony internetowej to sprawdzenie jej kodu (np. HTML, CSS) pod kątem zgodności ze standardami W3C, w celu wykrycia i usunięcia błędów. Poprawny kod lepiej wyświetla się w różnych przeglądarkach. Dlatego walidacja to wykrywanie i usuwanie błędów.

Pytanie 26

Którą wartością można zapisać kolor BIAŁY?

A.
#000000
B.
rgb(FF, FF, FF)
C.
#255255
D.
rgb(255, 255, 255)

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Biały powstaje z maksymalnych wartości wszystkich trzech składowych: <code><span class="code-function">rgb</span><span class="code-text">(</span><span class="code-number">255</span><span class="code-text">,</span> <span class="code-number">255</span><span class="code-text">,</span> <span class="code-number">255</span><span class="code-text">)</span></code> (lub szesnastkowo <code><span class="code-text">#</span><span class="code-variable">FFFFFF</span></code>). Dlatego biały to <code><span class="code-function">rgb</span><span class="code-text">(</span><span class="code-number">255</span><span class="code-text">,</span> <span class="code-number">255</span><span class="code-text">,</span> <span class="code-number">255</span><span class="code-text">)</span></code>.

Pytanie 27

Aby elementy <li> listy menu wyświetlały się w jednej linii (poziomo), której właściwości CSS użyć?

A.
position
B.
outline
C.
text-align
D.
display

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Sposób wyświetlania elementu zmienia właściwość <code><span class="code-variable">display</span></code>. Ustawiając elementom <code><span class="code-text">&lt;</span><span class="code-keyword">li</span><span class="code-text">&gt;</span></code> np. <code><span class="code-keyword">display</span><span class="code-text">:</span> <span class="code-variable">inline</span></code> lub <code><span class="code-keyword">display</span><span class="code-text">:</span> <span class="code-variable">inline-block</span></code>, układa się je w jednej linii (poziome menu). Dlatego poziomy układ daje <code><span class="code-variable">display</span></code>.

Pytanie 28

Na stronie internetowej dodano grafikę w kodzie HTML. Co się stanie, jeśli plik rysunek.png nie zostanie odnaleziony przez przeglądarkę?

<img src="rysunek.png" alt="pejzaż">
A. zademonstruje błąd wyświetlania strony w miejscu grafiki
B. wstawi tekst "rysunek.png" zamiast grafiki
C. nie pokaże strony internetowej
D. wyświetli tekst "pejzaż" w miejscu grafiki

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
W HTML znacznik <img> jest używany do wstawiania obrazów na stronach. Ważne, żeby pamiętać o atrybucie src, który mówi przeglądarce, skąd ma wziąć obraz. A alt to taki tekst zapasowy, który wyświetli się, jeśli obrazek nie załaduje się z jakiegoś powodu. To istotne, bo ułatwia dostępność dla osób, które mogą mieć trudności z widzeniem. Na przykład, gdy plik rysunek.png się nie załaduje, to wyświetli się tekst z atrybutu alt - w tym przypadku słowo pejzaż. To jest zgodne z dobrymi praktykami, bo każdy powinien wiedzieć, co miało być na obrazku, nawet jeśli go nie widzi. To także pomaga wyszukiwarkom w indeksowaniu treści. A używanie atrybutu alt to rzecz, którą warto stosować, jeśli chcemy, żeby nasza strona była dostępna i przyjazna dla użytkowników. Przy tym, przypomina mi się, że to też jest zgodne z zasadami dostępności WCAG.

Pytanie 29

Jaki zapis znacznika <div> może występować w dokumencie HTML tylko raz, a jego ponowne użycie spowoduje pojawienie się błędów podczas walidacji dokumentu?

A. <div>
B. <div class="klasa1 klasa2">
C. <div class="klasa">
D. <div id="identyfikator">

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Zapis <div id="identyfikator"> jest poprawny, ponieważ atrybut id w HTML powinien być unikalny w obrębie całego dokumentu. Oznacza to, że dla każdego elementu HTML można przypisać tylko jeden identyfikator, co pozwala na jednoznaczne odnalezienie danego elementu w kodzie. Przykładowo, w przypadku skryptów JavaScript lub stylów CSS, odwołując się do identyfikatora za pomocą selektora CSS (np. #identyfikator), mamy pewność, że dotykamy tylko jednego, konkretnego elementu. To podejście jest zgodne z zasadami dobrych praktyk webowych, które kładą duży nacisk na semantykę i czytelność kodu. Unikalność identyfikatora wspomaga również dostępność strony, umożliwiając czytnikom ekranu oraz innym technologiom asystującym łatwiejsze nawigowanie po dokumencie. Warto pamiętać, że w przypadku błędnego przypisania tego samego id do wielu elementów, walidacja HTML zgłosi błąd, co skutkuje problemami ze zgodnością z W3C i innymi standardami webowymi.

Pytanie 30

Zamieszczony kod HTML formularza zostanie wyświetlony przez przeglądarkę w sposób:

<form>
stanowisko: <input type="text"> <br>
obowiązki: <br>
<input type="checkbox" name="obowiazki1" value="1" disabled checked> sporządzanie dokumentacji<br>
<input type="checkbox" name="obowiazki2" value="2" checked>pisanie kodu<br>
<input type="checkbox" name="obowiazki3" value="3">testy oprogramowania<br>
</form>
Ilustracja do pytania
A. C
B. D
C. B
D. A

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Poprawna odpowiedź to forma, w której przeglądarka wyświetli treść formularza, uwzględniając zarówno etykiety, jak i wszystkie zaznaczone opcje. W tym przypadku, po wypełnieniu formularza, użytkownik zobaczy: "stanowisko: obowiązki: sporządzanie dokumentacji pisanie kodu testy oprogramowania". Kluczowym aspektem jest to, że w formularzu użyto atrybutu 'disabled' dla pierwszego checkboxa, co oznacza, że nie będzie on mógł zostać odznaczony przez użytkownika, ale mimo to jego etykieta zostanie wyświetlona. Przeglądarki internetowe renderują formularze na podstawie struktury HTML, a to, co jest niewidoczne dla użytkownika (checkboxy, które są odznaczone lub zablokowane), nie wpływa na wyświetlanie tekstowych etykiet. Zgodnie z zasadami dostępności i użyteczności, ważne jest, aby użytkownik miał pełny wgląd w dostępne opcje, co poprawia interakcję z formularzem. To podejście jest zgodne z dobrymi praktykami projektowania interfejsów użytkownika, które promują przezroczystość i jasność w komunikacji z użytkownikiem.

Pytanie 31

Grafik pragnie zmienić obraz JPG na format PNG bez utraty jakości, tak aby w obszarach, gdzie pierwotnie był kolor biały, w finalnym obrazie występowała przezroczystość. W tym celu powinien

A. zaimportować obraz do edytora grafiki wektorowej
B. przekształcić obraz w odcienie szarości
C. zmniejszyć rozdzielczość obrazu
D. dodać kanał alfa

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Dodanie kanału alfa do obrazu JPG, aby uzyskać przezroczystość w kolorze białym, jest najlepszym podejściem. Kanał alfa to dodatkowa warstwa informacji w pliku graficznym, która definiuje przezroczystość każdego piksela. W formacie PNG, kanał alfa umożliwia tworzenie przezroczystych tła, co jest szczególnie przydatne w projektach, gdzie elementy graficzne muszą być nakładane na różne tła. W praktyce, aby uzyskać pożądany efekt, grafik powinien użyć narzędzi do edycji grafiki, takich jak Adobe Photoshop, GIMP lub Inkscape. Po zaimportowaniu obrazu JPG, użytkownik może użyć funkcji selekcji koloru, aby zaznaczyć obszary białe, a następnie usunąć je, co wprowadzi przezroczystość w tych miejscach. Na końcu, obraz można zapisać jako PNG, co zachowa wprowadzone zmiany. Tego typu operacje są standardem w pracy z grafiką komputerową, szczególnie w projektach związanych z web designem i tworzeniem materiałów reklamowych.

Pytanie 32

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. local-top
D. border-top

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
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 33

W dokumencie HTML umieszczono tekst sformatowany określonym stylem. Aby wprowadzić w treści kilka słów o zróżnicowanym stylu, należy użyć znacznika

A. <hr>
B. <table>
C. <section>
D. <span>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Znacznik <span> jest używany w HTML do definiowania niewielkich fragmentów tekstu, które można stylizować niezależnie od reszty treści. Przy jego pomocy możemy wprowadzać różne style CSS, co pozwala na skomponowanie bardziej zróżnicowanego wizualnie tekstu. Na przykład, możemy użyć znacznika <span> do podkreślenia ważnych słów w zdaniu, zmieniając ich kolor lub czcionkę. Ważne jest, aby znacznik <span> nie wprowadzał żadnych zmian semantycznych w treści; jest to znacznik czysto stylistyczny. W praktyce, korzystając z CSS, możemy zastosować różne klasy do elementów <span>, co zwiększa elastyczność w zakresie stylizacji. Przykład: <span class='highlight'>ważne słowo</span> może zostać zapisane w arkuszu stylów jako .highlight { background-color: yellow; }. To podejście jest zgodne z zasadami semantycznego HTML oraz wykorzystania CSS, co jest rekomendowaną praktyką w tworzeniu stron internetowych.

Pytanie 34

Której pseudoklasy CSS użyć, aby element zmieniał kolor po najechaniu kursorem?

A.
:hover
B.
:active
C.
:coursor
D.
:visited

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Pseudoklasa <code><span class="code-text">:</span><span class="code-variable">hover</span></code> zmienia wygląd elementu, gdy najedzie na niego kursor, np. <code><span class="code-keyword">a</span><span class="code-text">:</span><span class="code-variable">hover</span> <span class="code-text">{</span> <span class="code-keyword">color</span><span class="code-text">:</span> <span class="code-variable">red</span><span class="code-text">;</span> <span class="code-text">}</span></code> podświetli link pod myszą. To podstawowy sposób na interaktywne reakcje bez JavaScriptu. Zapamiętaj: „hover” = unoszenie kursora nad elementem.

Pytanie 35

Jaki kolor oznacza zapis szesnastkowy #0000FF?

A. czerwony
B. niebieski
C. zielony
D. czarny

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
W zapisie szesnastkowym <code><span class="code-text">#</span><span class="code-variable">RRGGBB</span></code> kolejne pary to czerwony, zielony i niebieski. W <code><span class="code-text">#</span><span class="code-number">0000</span><span class="code-variable">FF</span></code> czerwony i zielony są zerowe, a niebieski maksymalny (<code><span class="code-variable">FF</span></code> = 255), więc kolor jest NIEBIESKI. Dlatego <code><span class="code-text">#</span><span class="code-number">0000</span><span class="code-variable">FF</span></code> to niebieski.

Pytanie 36

Jaką barwę przedstawia kolor zapisany w modelu RGB(0, 0, 255)?

A. niebieską
B. żółtą
C. czerwoną
D. zieloną

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
W modelu RGB barwę tworzą składowe czerwona (R), zielona (G) i niebieska (B) o wartościach 0-255. Zapis RGB(0, 0, 255) oznacza maksymalną składową niebieską i zerowe pozostałe, czyli czysty niebieski. Dlatego RGB(0, 0, 255) to barwa niebieska.

Pytanie 37

Zidentyfikuj styl CSS, który doprowadził do uzyskania pokazanego efektu.

Ilustracja do pytania
A. Styl 2
B. Styl 1
C. Styl 3
D. Styl 4

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź Styl 2 jest prawidłowa, ponieważ zastosowanie border-radius w wartości 50px pozwala osiągnąć efekt zaokrąglenia narożników elementu do kształtu koła, o ile element jest kwadratem. W tym przypadku obraz ma szerokość 100px, co oznacza, że promień zaokrąglenia równy 50px sprawia, że wszystkie narożniki zbiegają się w punktach centralnych ścianek kwadratu, tworząc idealny okrąg. Ta technika jest szeroko stosowana w projektowaniu stron internetowych zwłaszcza w odniesieniu do awatarów lub elementów graficznych, które wymagają zaokrąglonego kształtu. Stosowanie odpowiednich wartości border-radius jest zgodne z dobrymi praktykami w CSS, co pozwala projektantom na eleganckie i efektywne kształtowanie wyglądu witryny. Dzięki temu można tworzyć intuicyjne i estetyczne interfejsy użytkownika. Ważne jest również, aby testować wyświetlanie na różnych urządzeniach, ponieważ CSS powinien być responsywny i adaptowalny do różnorodnych rozdzielczości wyświetlaczy co zwiększa dostępność oraz użyteczność witryn.

Pytanie 38

Aby wskazać błędy składniowe w kodzie HTML, należy zastosować:

A. interpreter
B. walidator
C. kompilator
D. debugger

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Do sprawdzania poprawności kodu HTML służy walidator - na przykład walidator W3C (validator.w3.org). Analizuje on dokument pod kątem zgodności ze standardem języka i wypisuje błędy oraz ostrzeżenia: niezamknięte znaczniki, błędne zagnieżdżenia, nieprawidłowe atrybuty. HTML jest językiem znaczników, a nie programowania - nie kompiluje się go ani nie wykonuje, więc do kontroli składni używa się właśnie walidatora, a nie narzędzi typowych dla kodu programu.

Pytanie 39

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

A.
img + p
B.
img [p]
C.
img > p
D.
img p

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Akapit występujący bezpośrednio po obrazie wybiera selektor sąsiadujący <code><span class="code-variable">img</span> <span class="code-text">+</span> <span class="code-variable">p</span></code>. Operator <code><span class="code-text">+</span></code> oznacza element, który jest następnym rodzeństwem (sąsiadem) poprzedzającego - tu: pierwszy <code><span class="code-text">&lt;</span><span class="code-keyword">p</span><span class="code-text">&gt;</span></code> stojący tuż po <code><span class="code-text">&lt;</span><span class="code-keyword">img</span><span class="code-text">&gt;</span></code> na tym samym poziomie. Dzięki temu stylujesz dokładnie ten jeden akapit, nie ruszając pozostałych. Dlatego poprawny jest <code><span class="code-variable">img</span> <span class="code-text">+</span> <span class="code-variable">p</span></code>.

Pytanie 40

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

Ilustracja do pytania
A. 77A1C1
B. 71A0B2
C. 76A3C1
D. 77A0C1

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Kolor w modelu RGB zapisany jako 119 160 193 odpowiada wartości szesnastkowej 77A0C1. W systemie RGB każda z trzech składowych kolorów czerwonego zielonego i niebieskiego jest reprezentowana przez wartość od 0 do 255. Przy konwersji do systemu szesnastkowego używamy par znaków dla każdej z wartości. Dla wartości 119 uzyskujemy 77 dla 160 otrzymujemy A0 a dla 193 wynik to C1. Sumując te wartości uzyskujemy kod 77A0C1 który jest szeroko stosowany w projektach graficznych i webowych. W praktyce znajomość zapisu szesnastkowego jest niezbędna w branży IT zwłaszcza w web designie oraz przy tworzeniu interfejsów użytkownika. Standardem jest wykorzystywanie tego zapisu w stylach CSS gdzie precyzyjne określenie koloru ma kluczowe znaczenie dla estetyki i funkcjonalności projektu. Prawidłowy dobór i zapis kolorów wpływa na UX i branding dlatego znajomość sposobów konwersji i czytania kolorów w różnych systemach jest kluczowa dla profesjonalistów w tej dziedzinie.