ARKUSZ EGZAMINACYJNY

INF.03
Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych

Zawód: Technik programista
Liczba pytań: 20
Czas trwania: 60 minut (standardowo)
Próg zdawalności: 50% (10 pytań)

Arkusz wygenerowany na platformie zawodowe.edu.pl

Tysiące pytań zgodnych z CKE ze wszystkich kwalifikacji zawodowych
System nauczyciel-uczeń do monitorowania postępów w czasie rzeczywistym
Egzaminy zawodowe próbne dla Twoich uczniów (skórka CKE)
Generator arkuszy PDF z możliwością edycji i udostępniania
Całkowicie darmowy dostęp bez limitów i ukrytych opłat
Bez reklam dla zalogowanych użytkowników

❤️ Dlaczego darmowe? Bo edukacja nie powinna być przywilejem.

Załóż darmowe konto i korzystaj z pełni możliwości:

Śledź swoje postępy • Zapisuj arkusze • Rozwiązuj testy online

Wygenerowano: 11.04.2026 02:21
Token arkusza:_8B0iS6TM9r_FA4f
Link do edycji:zawodowe.edu.pl/generator-arkuszy/klon/_8B0iS6TM9r_FA4f/

1Pytanie 1

Jakie znaki <header>, <article>, <section>, <footer> są typowe dla tego języka?

A. HTML 5

B. XHTML 1.1

C. HTML 4.01 Transitional

D. HTML 4.01 Strict

2Pytanie 2

Wskaż blok, który jest sformatowany zgodnie z podanym stylem CSS.

background: linear-gradient(to right, LightBlue, DarkBlue);

A. Blok 1

B. Blok 2

C. Blok 3

D. Blok 4

3Pytanie 3

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 3.

B. Kod 1.

C. Kod 2.

D. Kod 4.

4Pytanie 4

Element

<meta charset="utf-8">

definiuje metadane dotyczące strony internetowej, odnosząc się do

A. opisu witryny

B. języka witryny

C. słów kluczowych

D. kodowania znaków

5Pytanie 5

Jaki selektor stylizuje akapity tekstu z klasą tekst oraz element blokowy z identyfikatorem obrazki?

A. p.tekst, div#obrazki

B. p#tekst, div.obrazki

C. p.tekst + div#obrazki

D. p#tekst + div.obrazki

6Pytanie 6

Który z poniższych fragmentów kodu HTML5 zostanie uznany za niepoprawny przez walidator HTML?

A. <pre><p class= "stl" id= "a">tekst</p></pre>

B. <pre><p class= "stl"><style>.a{color:#F00}</style>tekst</p></pre>

C. <pre><p class= "stl" style= "color: #F00 ">tekst</p></pre>

D. <pre><p class= "stl">tekst</p></pre>

7Pytanie 7

Wskaż przycisk sformatowany przedstawionym stylem CSS.

#przycisk {
    background-color: white;
    padding: 10px;
    border-width: 2px;
    border-bottom-style: dashed;
}

Przycisk 1

Przycisk 2

Przycisk 3

Przycisk 4

A. Przycisk 4

B. Przycisk 1

C. Przycisk 3

D. Przycisk 2

8Pytanie 8

Który kod HTML spowoduje identyczne formatowanie jak przedstawione na obrazku?

W tym paragrafie zobaczysz sposoby formatowania tekstu w HTML

<p>W tym <i>paragrafie zobaczysz sposoby formatowania</i> tekstu w HTML</p>
<p>W tym <b>paragrafie <i>zobaczysz</i> sposoby formatowania</b> tekstu w HTML</p>
<p>W tym <i>paragrafie <b>zobaczysz</b> sposoby formatowania</i> tekstu w HTML</p>
<p>W tym <i>paragrafie </i><b>zobaczysz</b><i> sposoby formatowania</i> tekstu w HTML</p>

A. Odpowiedź A

B. Odpowiedź B

C. Odpowiedź C

D. Odpowiedź D

9Pytanie 9

Do którego akapitu przypisano podaną właściwość stylu CSS?
border-radius: 20%;

A. Rys. A

B. Rys. B

C. Rys. C

D. Rys. D

10Pytanie 10

Zdefiniowany styl CSS spowoduje, że nagłówki pierwszego poziomu będą

A. wyjustowane, pisane wielkimi literami, a odstępy między liniami ustalone na 10 px

B. wyjustowane, pisane małymi literami, a odstępy między literami ustalone na 10 px

C. wyśrodkowane, pisane małymi literami, a odstępy między liniami ustalone na 10 px

D. wyśrodkowane, pisane wielkimi literami, a odstępy między literami ustalone na 10 px

11Pytanie 11

Aby ustalić wysokość grafiki wyświetlanej na stronie internetowej, należy użyć właściwości CSS o nazwie

A. padding

B. margin

C. height

D. width

12Pytanie 12

Jakim zapisem można w dokumencie HTML stworzyć element, który wyświetla obraz kotek.jpg oraz zawiera tekst alternatywny „obrazek kotka”?

A. <img href="/kotek.jpg" title="obrazek kotka">

B. <img src="/kotek.jpg" title="obrazek kotka">

C. <img href="/kotek.jpg" alt="obrazek kotka">

D. <img src="/kotek.jpg" alt="obrazek kotka">

13Pytanie 13

Dla przedstawionego fragmentu kodu

<img src="kwiat.jpg alt="kwiat">

walidator HTML zwróci błąd, ponieważ

A. użyto niewłaściwego znacznika do wyświetlenia grafiki

B. użyto nieznanego atrybutu alt

C. nie odnaleziono pliku kwiat.jpg

D. nie zamknięto cudzysłowu

14Pytanie 14

Który zapis CSS wprowadzi niebieskie tło dla bloku?

A. div {background-color: blue;}

B. div {border-color: blue;}

C. div {color: blue;}

D. div {shadow: blue;}

15Pytanie 15

Wskaż kod CSS, który odpowiada layoutowi bloków 2 – 5, zakładając, że są one utworzone na podstawie podanego kodu HTML.

A. Kod 1

B. Kod 2

C. Kod 3

D. Kod 4

16Pytanie 16

Selektor CSS a:link {color:red} w arkuszach stylów nazywanych kaskadowymi określa

A. klasę.

B. pseudoklasę.

C. identyfikator.

D. pseudoelement.

17Pytanie 17

W języku HTML, dane dotyczące autora, opisu oraz słów kluczowych strony powinny być zamieszczone

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

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

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

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

18Pytanie 18

Witryna internetowa powinna mieć zaprezentowaną strukturę bloków. Aby osiągnąć ten układ, należy przypisać sekcjom odpowiednie właściwości w następujący sposób:

A. float wyłącznie dla bloku 5; clear dla bloku 2

B. float tylko dla bloków: 3, 4; clear dla bloku 5

C. float tylko dla bloku 2; clear dla bloków: 3, 4

D. float tylko dla bloków: 2, 3, 4; clear dla bloku 5

19Pytanie 19

W języku HTML aby zdefiniować słowa kluczowe strony, należy użyć zapisu

A. <meta name = "keywords" content = "psy, koty, gryzonie">

B. <meta name = "keywords" = "psy, koty, gryzonie">

C. <meta name = "description" content = "psy, koty, gryzonie">

D. <meta keywords = "psy, koty, gryzonie">

20Pytanie 20

Aby uczynić stronę internetową bardziej dostępną dla osób niewidomych, należy przypisać obrazom wyświetlanym za pomocą znacznika img odpowiedni atrybut

A. alt

B. src

C. text

D. style

🔑 KLUCZ ODPOWIEDZI

Token: _8B0iS6TM9r_FA4f | INF.03 | Pytań: 20 | Próg: 10 poprawnych

Numer zadania	Odpowiedź
1	A
2	B
3	C
4	D
5	A
6	B
7	D
8	C
9	B
10	D
11	C
12	D
13	D
14	A
15	B
16	B
17	A
18	D
19	A
20	A

🖨️ Gotowe do wydruku!

ARKUSZ EGZAMINACYJNY

INF.03Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych

🔑 KLUCZ ODPOWIEDZI

INF.03
Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych