wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

HTML CSS

Total questions: 85

Worksheet time: 1hrs 23mins

Name
Class
Date
1.

W języku CSS zdefiniowano formatowanie

p > i {color:blue}

Oznacza to,że kolorem niebieskim zostanie zapisany

a)

cały tekst paragrafu niezależnie od jego formatowania

b)

pochylony tekst paragrafu.

c)

cały tekst nagłówka niezależnie od od ich formatowania.

d)

pogrubiony tekst paragrafu

2.

Wskaż znacznik akapitu.

a)

<br>

b)

<b>

c)

<div>

d)

<p>

3.

Wyróżnienie tekstu (pogrubienie).

a)

<a>

b)

<strong>

c)

<p>

d)

<span>

4.

Tworzenie nagłówka

a)

<p>

b)

<h2>

c)

<b>

d)

<strong>

5.

Rozmiar czcionki w stylach to:

a)

font-family

b)

text-size

c)

font-size

d)

padding

6.

Krój czcionki możemy określić poprzez

a)

font-size

b)

font-family

c)

family

d)

text-family

7.

Kolor tła strony

a)

background

b)

background-image

c)

background-color

d)

background-size

8.

wyrównanie (do środka) tekstu na stronie

a)

text-align: center;

b)

font-align: center;

c)

margin: auto;

d)

float: center;

9.
Kod języka CSS można umieścić wewnątrz kodu HTML, posługując się znacznikiem
a)
<head>
b)
<style>
c)
<meta>
d)
<body>
10.

Co wyświetli się na przeglądarce w wyniku zastosowania poniższego zapisu?

<p style="font-family: 'courier new' font-style: italic;">Ala ma słonia.</p>

a)
b)
c)
d)
11.
Kod języka CSS można umieścić wewnątrz kodu HTML, posługując się znacznikiem
a)
<head>
b)
<style>
c)
<meta>
d)
<body>
12.
W języku CSS aby sformatować dowolny element języka HTML w ten sposób, że po najechaniu na niego kursorem zmienia on kolor czcionki, należy zastosować pseudoklasę
a)
active
b)
hover
c)
visited
d)
coursor
13.

Wstawienie grafiki

a)

<img href="nazwa.rozszerzenie">

b)

<img src="nazwa.rozszerzenie">

c)

<a href="nazwa.rozszerzenie">

d)

<a src="nazwa.rozszerzenie">

14.

Tworzenie linku

a)

<a src="adresstrony">Tekst na który klikamy</a>

b)

<url src="adresstrony">Tekst na który klikamy</a>

c)

<a href="adresstrony">Tekst na który klikamy</a>

d)

<a url="adresstrony">Tekst na który klikamy</a>

15.
Aby uzyskać efekt rozstrzelenia liter w selektorze CSS, należy użyć właściwości
a)
letter-transform
b)
text-decoration
c)
letter-spacing
d)
text-space
16.

W języku CSS zapis:


h2 {background-color: green;}


sprawi, że koloru zielonego będzie

a)
tło całej strony.
b)
czcionka nagłówka drugiego stopnia.
c)
tło tekstu nagłówka drugiego stopnia.
d)
czcionka każdego nagłówka na stronie.
17.
W języku CSS, aby sformatować tekst poprzez przekreślenie, podkreślenie dolne lub górne należy zastosować atrybut
a)
text-align
b)
text-indent
c)
text-transform
d)
text-decoration
18.

W języku CSS zapis


p::first-line {font-size: 150%;}


użyty na stronie, na której jest kilka paragrafów, a każdy z nich ma po kilka linii sprawi, ze

a)
pierwsza linia każdego paragrafu będzie miała mniejszą czcionkę niż następne linie.
b)
pierwsza linia każdego paragrafu będzie miała większą czcionkę niż następne linie.
c)
pierwszy paragraf na stronie będzie w całości miał powiększoną czcionkę
d)
całość tekstu paragrafu będzie powiększona o 150%.
19.
W języku CSS,aby zdefiniować niestandardowe odstępy między wyrazami, stosuje się właściwość
a)
line-spacing
b)
white-space
c)
word-spacing
d)
latter-space
20.
Aby przygotować szablon strony z trzema kolumnami ustawionymi obok siebie, można posłużyć się stylem CSS
a)
.kolumny{ float: left; width: 33%; }
b)
.kolumny{ float: right; height: 33%; }
c)
.kolumny{ clear: both; height: 33%; }
d)
.kolumny{ float: left; width: 40%; }
21.

Dla akapitu zdefiniowano styl CSS. Które właściwości stylu CSS poprawnie opisują dla akapitu krój czcionki: Arial; rozmiar czcionki: 16 pt; styl czcionki: pochylenie?

a)

p {

font-style: Arial; size: 16px;

font-weight: normal;

}

b)

p {

font-family: Arial;

font-size: 16pt;

font-style: italic;

}

c)

p {

font-style: Arial;

font-size: 16pt;

font-variant: normal;

}

d)

p {

font-family: Arial;

font-size: 16px;

font-variant: normal;

}

22.

Znacznik <meta charset="UTF-8"> służy do:

a)

tworzenia akapitów

b)

wstawiania obrazka

c)

poprawnego wyświetlania polskich znaków

d)

nie ma żadnego znaczenia

23.

Struktura tabeli ma postać:

a)

<table>

<tr>

<td> </td>

</tr>

</table>

b)

<td>

<tr>

<table> </td>

</tr>

</table>

c)

<table>

<ul>

<li> </li>

</ul>

</table>

d)

<table>

<ol>

<li> </li>

</ol>

</table>

24.

Link wewnętrzny ma postać:

a)

<a href="?Obsada">Obsada</a>

b)

<a href="#Obsada">Obsada</a>

c)

<a href="$Obsada">Obsada</a>

d)

<a href="/Obsada">Obsada</a>

25.
Zamieszczony kod HTML formularza zostanie wyświetlony przez przeglądarkę w sposób:
a)
a
b)
b
c)
c
d)
d
26.
Poniżej przedstawiono fragment kodu języka HTML. Jest on definicją listy:
a)
a
b)
b
c)
c
d)
d
27.
W języku HTML atrybut alt znacznika img jest wykorzystywany w celu zdefiniowania
a)
ścieżki i nazwy pliku źródłowego grafiki
b)
tekstu, który będzie wyświetlony, jeśli nie może być wyświetlona grafika
c)
podpisu, który zostanie wyświetlony pod grafiką
d)
atrybutów grafiki, takich jak rozmiar, obramowanie, wyrównanie
28.
W załączonym fragmencie kodu CSS kolor jest zapisany w postaci
a)
HSL
b)
dziesiętnej
c)
CMYK
d)
szesnastkowej
29.
Który z odsyłaczy posiada poprawną konstrukcję?
a)
<a href='mailto:adres'> tekst </a>
b)
<a href='http://adres'> tekst </a>
c)
<a href="http://adres"> tekst <a>
d)
<a href="mailto:adres"> tekst </a>
30.

CSS to...

a)

kaskadowe arkusze stylów.

b)

kod używany do tworzenia struktury strony i jej zawartości.

c)

dynamiczny język programowania.

d)

oprogramowanie korzystające z usług serwera.

31.

Sekcja <head> w dokumencie html zawiera...

a)

informacje dla przeglądarki, w jaki sposób ma wyświetlać stronę internetową.

b)

zawartość strony internetowej widoczną dla użytkownika.

c)

informacje dla wyszukiwarki.

d)

automatyczne tłumaczenie kodu napisanego w jednym języku na równoważny kod w innym języku.

32.

Która lista jest interpretacją przedstawionego kodu?

a)
b)
c)
d)
33.

W języku CSS zdefiniowano styl. Sformatowana stylem sekcja będzie zawierała obramowanie o szerokości

a)

2 px oraz marginesy na zewnątrz tego obramowania

b)

2 px oraz marginesy wewnątrz tego obramowania

c)

20 px oraz marginesy wewnątrz tego obramowania

d)

20 px oraz marginesy na zewnątrz tego obramowania

34.

Proces walidacji strony internetowej to

a)

promocja strony

b)

zespół działań mających na celu zwiększenie oglądalności

c)

sprawdzenie jej w celu wyeliminowania błędów

d)

publikowanie w sieci

35.

Które z pól są umieszczone w formularzu?

a)

Input(Text), Input(Chechbox), Select, Select, Input(Submit), Input(Reset)

b)

Input(Text), Select, Input(Radio), Input(Radio), Input(Submit), Input(Reset)

c)

Textarea, Option, Input(Chechbox), Input(Checkbox), Input(Submit) Input(Reset)

d)

Textarea, Select, Input(Radio), Input(Radio), Input(Reset), Input(Submit)

36.

Prawidłowa nazwa klasy w CSS to

a)

.klasa

b)

#klasa

c)

:klasa

d)

@klasa

37.

Prawidłowa nazwa identyfikatora w CSS to

a)

.id

b)

#id

c)

:id

d)

@id

38.

Styl z pliku styl.css możemy zaimportować do dokumentu HTML przy pomocy tagu:

a)

<meta>

b)

<head>

c)

<link>

d)

<import>

39.

Tekst pisany w indeksie górnym

a)

<sub>

b)

<b>

c)

<sup>

d)

<i>

40.

Pozycję kolejnych elementów na liście numerowanej lub wypunktowanej określamy znacznikiem:

a)

<ol>

b)

<ul>

c)

<li>

d)

<h2>

41.

Aby wstawić komórkę nagłówkową w HTML należy użyć znaczników:

a)

<th> </th>

b)

<td> </td>

c)

<tr> </tr>

d)

<tt> </tt>

42.

W formularzu HTML grupę pól wyboru, z których użytkownik będzie mógł zaznaczyć tylko jedno definiują znaczniki:

a)

<input type="radio">

b)

<input type="checkbox">

c)

<input type="text">

d)

<input type="number">

43.

Domyślnym sposobem kodowania znaków w HTML5 jest

a)

utf-8

b)

utf-16

c)

iso-8859-2

d)

windows-1250

44.

Podstawowa struktura dokumentu HTML (tzw.szkielet) musi zawierać następujące znaczniki:

a)

a. <!doctype>

b. <html></html>

c. <head></head>

d. <body></body>

b)

a. <html></html>

b. <body></body>

c. <title></title>

c)

a. <html></html>

b. <body></body>

c. <p></p>

d)

a. <html></html>

b. <head></head>

c. <meta charset="UTF-8">

45.

wyrównanie (do środka) tekstu na stronie

a)

text-align: center;

b)

font-align: center;

c)

margin: auto;

d)

float: center;

46.
Polecenie colspan służy do łączenia komórek tabeli w poziomie, natomiast rowspan w pionie. Którą z tabel wyświetli fragment kodu napisany w języku HTML?
a)
A
b)
B
c)
C
d)
D
47.

W kodzie CSS zdefiniowano cztery klasy formatowania, których następnie użyto do formatowania paragrafów. Efekt widoczny na rysunku powstał po zastosowaniu klasy o nazwie

a)

format1

b)

format2

c)

format3

d)

format4

48.

Który z wymienionych znaczników języka HTML może posłużyć do budowy struktury strony internetowej?

a)

<em>

b)

<aside>

c)

<input>

d)

<mark>

49.

Przedstawiono tabelę zdefiniowaną kodem HTML, bez formatowania CSS. Który z fragmentów kodu HTML odpowiada pierwszemu wierszowi tabeli?

a)
b)
c)
d)
50.

Na obrazie przedstawiono efekt formatowania stylami CSS oraz kod HTML generujący ten przykład. Zakładając, że marginesy wewnętrzne wynoszą 50 px, a zewnętrzne wynoszą 20 px, styl CSS dla obrazu ma postać

a)
b)
c)
d)
51.

Strona HTML definiuje akapit oraz rysunek. Aby rysunek został umieszczony przez przeglądarkę w tej samej linii co akapit po jego lewej stronie, należy w stylu CSS rysunku zawrzeć własność

a)

align:left;

b)

alt:left;

c)

style:left;

d)

float:left;

52.

Jaka jest domyślna wartość właściwości `box-sizing` dla większości elementów, takich jak `div`?

a)

content-box

b)

margin-box

c)

padding-box

d)


border-box

53.

Element ma `width: 200px;`, `padding: 10px;` oraz `border: 5px solid black;`. Jaka będzie jego całkowita, renderowana szerokość przy domyślnym `box-sizing`?

a)

210px

b)


230px

c)

200px

d)


215px

54.

Jaki jest cel stosowania resetu CSS `* { margin: 0; padding: 0; }`?

a)

Zwiększenie wydajności strony poprzez usunięcie niepotrzebnych właściwości.

b)

Wyśrodkowanie wszystkich elementów na stronie.

c)

Usunięcie domyślnych marginesów i dopełnień dodawanych przez przeglądarkę do różnych elementów.

d)

Ustawienie wszystkich czcionek na ten sam rozmiar.

55.

Jaki jest cel deklaracji `<!DOCTYPE html>` na samym początku dokumentu HTML?

a)

Określenie języka, w którym napisana jest treść strony, np. polskiego.

b)

Poinformowanie przeglądarki, że dokument jest napisany w standardzie HTML5, co zapewnia poprawne renderowanie strony.

c)

Podłączenie zewnętrznego arkusza stylów CSS do dokumentu.

d)


Zdefiniowanie tytułu strony, który pojawia się w zakładce przeglądarki.

56.

atrybut `target="_blank"` w znaczniku `<a>`. Jaki jest jego efekt?

a)

Link otworzy się w tej samej karcie, ale na pustej, białej stronie.

b)

Sprawi, że link będzie można kliknąć tylko raz.

c)

Link będzie niewidoczny, dopóki użytkownik nie najedzie na niego kursorem.

d)

Link zostanie otwarty w nowej karcie lub nowym oknie przeglądarki.

57.

Która z poniższych deklaracji CSS poprawnie ustawi ramkę o grubości 2 pikseli, przerywaną i czerwoną?

a)


border: 2px dashed red;

b)

border-style: 2px dashed red;

c)

border-width: 2px; border-color: dashed; border-style: red;

d)


border: 2px red dashed;

58.

W języku CSS określono formatowanie znacznika h1 według wzoru. Zakładając, że żadne inne formatowanie nie jest dodane do znacznika h1, wskaż sposób formatowania tego znacznika

a)

A

b)

B

c)

C

d)

D

59.

Wskaż stwierdzenie, które jest prawdziwe dla następującej definicji stylu:

a)

Akapit będzie transponowany na małe litery

b)

Odnośnik będzie pisany czcionką 14 punktów

c)

Jest to styl lokalny

d)

Zdefiniowano dwie klasy

60.

Wskaż prawidłową kolejność stylów CSS mając na uwadze ich pierwszeństwo w formatowaniu elementów strony WWW.

a)

Lokalny, Wewnętrzny, Zewnętrzny

b)

Wewnętrzny, Zewnętrzny, Rozciąganie stylu

c)

Rozciąganie stylu, Zewnętrzny, Lokalny

d)

Zewnętrzny, Wydzielone bloki, Lokalny

61.

W języku CSS, należy zdefiniować tło dokumentu jako obraz rys.png. Obraz ma powtarzać się jedynie w poziomie. Którą definicję należy przypisać selektorowi body?

a)

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

b)

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

c)

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

d)

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

62.

Dla którego akapitu zastosowano przedstawioną właściwość stylu CSS?

a)

a

b)

b

c)

c

d)

d

63.

W języku CSS wartości underline, overline, blink przyjmują atrybut

a)

text-decoration

b)

font-weight

c)

font-style

d)

text-style

64.

Na obrazie przedstawiono tabelę ze scalonymi komórkami. Które atrybuty scalania zastosowano, aby uzyskać ten efekt?

a)

colspan w drugim wierszu i pierwszej komórce oraz rowspan w trzecim wierszu i czwartym wierszu.

b)

colspan w drugim wierszu i pierwszej komórce oraz rowspan w trzecim wierszu, trzeciej komórce.

c)

colspan w drugim wierszu we wszystkich trzech komórkach oraz rowspan w trzecim wierszu ostatniej komórce.

d)

rowspan w drugim wierszu i pierwszej komórce oraz colspan w trzecim wierszu, trzeciej komórce

65.

Który znacznik HTML jest elementem blokowym?

a)

span

b)

img

c)

p

d)

strong

66.

Fragment kodu napisany w języku HTML zamieszczony w ramce przedstawia listę

a)

numerowaną

b)

odnośników

c)

skrótów

d)

wypunktowaną

67.

Znaczniki <header>, <article>, <section>, <footer> są charakterystyczne dla języka

a)

HTML 4.01 Transitional

b)

HTML 4.01 Strict

c)

HTML 5

d)

XHTML 1.1

68.

Tekst paragrafu, wyśrodkowany w pionie, opisuje w CSS reguła

a)

align: middle

b)

text-align: center

c)

vertical-align: center

d)

vertical-align: middle

69.

Chcąc dodać do listy rozwijalnej przedstawionego formularza HTML możliwość zaznaczenia kilku opcji jednocześnie, należy w znaczniku select dodać atrybut

a)

disabled

b)

multiple

c)

value

d)

size

70.

W podanym kodzie HTML przedstawiony styl CSS jest stylem:

a)

dynamicznym

b)

lokalnym

c)

nagłówkowym

d)

zewnętrznym

71.

Język HTML dysponuje do budowania hierarchii treści. Nagłówki te występują jedynie w zakresie

a)

h1-h4

b)

h1-h6

c)

h1-h8

d)

h1-h10

72.

Przedstawiono tabelę zdefiniowaną kodem HTML, bez formatowania CSS. Który z fragmentów kodu HTML odpowiada pierwszemu wierszowi tabeli?

a)
b)
c)
d)
73.

Przedstawiona linia kreskowana w stylu obramowania CSS jest określona właściwością

a)

double

b)

dashed

c)

solid

d)

dotted

74.

Jaki operator w CSS przypisany jest w użyciu jako selektor uniwersalny (ogólny)?

a)

>

b)

?

c)

*

d)

#

e)

.

75.

Składnia CSS

a)

selektor {właściwość;wartość;}

b)

selektor {właściwość:wartość,}

c)

{selektor;właściwość;wartość;}

d)

selektor {właściwość,wartość,}

76.

div + p {color:white;} to przykład użycia selektora:

a)

potomka

b)

sąsiadującego brata

c)

braci

d)

dziecka

77.

Odsyłacz odwiedzony w CSS obsługuje pseudoklasa:

a)

:link

b)

:visited

c)

:active

d)

:hover

78.
Który z przedstawionych kodów HTML sformatuje tekst według wzoru? (uwaga: słowo "stacji" jest zapisane większą czcionką niż reszta słów w tej linii)
a)
a
b)
b
c)
c
d)
d
79.
Między którymi znacznikami umieścisz tekst, który ma się pojawić na pasku tytułowym?
a)
a)  <body> Tekst </body>
b)
b) <head> Tekst </head>
c)
c) <title> Tekst </title>
d)
d) <html> Tekst </html>
80.
Aby przygotować szablon strony z trzema kolumnami ustawionymi obok siebie, można posłużyć się stylem CSS
a)
.kolumny{ float: left; width: 33%; }
b)
.kolumny{ float: right; height: 33%; }
c)
.kolumny{ clear: both; height: 33%; }
d)
.kolumny{ float: left; width: 40%; }
81.

Poprawny zapis komentarza w pliku CSS to:

a)

/*komentarz w CSS */

b)

< komentarz w CSS >

c)

<! komentarz w CSS !>

d)

{ komentarz w CSS }

82.

Jak wygląda podstawowa deklaracja modelu flexbox?

a)

display: box;

b)

display: flex;

c)

height: auto;

d)

padding: 0;

83.
Która z metod przesyłania formularza powinna zostać użyta do przesyłania hasła?
a)
POST
b)
PUT
c)
GET
d)
DELETE
84.
Blok deklaracji postaci background-attachment: scroll powoduje, że
a)
grafika tła będzie powtarzana (kafelki).
b)
tło strony będzie przewijane razem z tekstem.
c)
tło strony będzie stałe, a tekst będzie się przewijał.
d)
grafika tła będzie wyświetlona w prawym górnym rogu strony.
85.
W języku CSS aby zdefiniować odmienne formatowanie dla pierwszej litery akapitu, należy zastosować selektor
a)
klasy p.first-letter
b)
dziecka p + first-letter
c)
atrybutu p[first-letter]
d)
pseudoelementu p::first-letter

Similar Resources on Wayground

Decision Support Systems and Business Intelligence 1/2565

85 questions

Decision Support Systems and Business Intelligence 1/2565

quiz

Worksheet

•

University - Professi...

Kinimparahis

88 questions

Kinimparahis

quiz

Worksheet

•

Professional Development

1234

85 questions

1234

quiz

Worksheet

•

Professional Development

Tema 2 AD

80 questions

Tema 2 AD

quiz

Worksheet

•

Professional Development

Компьютерлік аппараттық қамтамасыз ету

89 questions

Компьютерлік аппараттық қамтамасыз ету

quiz

Worksheet

•

Professional Development