wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

HTML CSS

Total questions: 60

Worksheet time: 3600secs

Name
Class
Date
1.
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>
2.
Chcąc zdefiniować formatowanie tabeli w języku CSS w taki sposób, aby wiersz, który jest aktualnie wskazywany kursorem myszy, został wyróżniony np. innym kolorem, należy zastosować
a)
pseudoklasę :visited
b)
pseudoklasę :hover
c)
pseudoelement :fist-line
d)
nowy selektor klasy dla wiersza tabeli.
3.
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
4.
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.
5.
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.
6.
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
7.
W języku CSS zapis
a[target="_blank"] {color: yellow;}
sprawi, że kolor żółty przyjmie czcionka
a)
tekstu paragrafu.
b)
każdego odnośnika.
c)
odnośników, które otwierają się w osobnej karcie.
d)
odnośników, które otwierają się w tej samej karcie.
8.
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%.
9.
W języku CSS zapis w postaci:
p {background-image:url("rysunek.png");}
sprawi,że rysunek.png będzie
a)
tłem całej strony
b)
tłem każdego paragrafu
c)
wyświetlony obok każdego paragrafu.
d)
wyświetlony, jeśli w kodzie zostanie zastosowany znacznik img.
10.
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
11.
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.
12.
W języku CSS wcięcie pierwszej linii akapitu na 30 pikseli uzyska się za pomocą zapisu
a)
p {text-indent: 30px; }
b)
p {text-spacing: 30px; }
c)
p {line-height: 30px; }
d)
p {line-indent: 30px; }
13.
W języku CSS zdefiniowano następujące formatowanie.
Kolorem czerwonym zostanie zapisany
a)
tylko tekst pochylony nagłówka pierwszego stopnia.
b)
tylko tekst pochylony we wszystkich poziomach nagłówków.
c)
cały tekst nagłówka pierwszego stopnia oraz pochylony tekst akapitu.
d)
cały tekst nagłówka pierwszego stopnia oraz cały tekst pochylony, niezależnie od tego w którym miejscu strony się znajduje.
14.
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
15.
Zapis CSS postaci:
sprawi, że na stronie internetowej
a)
punktorem listy numerowanej będzie rys.gif
b)
rys.gif będzie stanowił ramkę dla listy numerowanej.
c)
wyświetli się rysunek rys.gif jako tło listy numerowanej.
d)
każdy z punktów listy będzie miał osobne tło pobrane z grafiki rys.gif
16.
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
17.
W języku CSS wartości: underline, overline, blink przyjmują atrybut
a)
text-style
b)
font-style
c)
font-weight
d)
text-decoration
18.
W przedstawionej definicji stylu CSS, powtarzanie dotyczy
body {
background-image: url("rysunek.gif");
background-repeat: repeat-y;
a)
tła każdego ze znaczników akapitu.
b)
rysunku umieszczonego znacznikiem img.
c)
rysunku umieszczonego w tle strony w pionie.
d)
rysunku umieszczonego w tle strony w poziomie.
19.
W języku CSS zdefiniowano styl. Sformatowana stylem sekcja będzie zawierała obramowanie o szerokości
div { border: solid 2px blue;
margin: 20px;}
a)
2 px oraz marginesy wewnątrz tego obramowania.
b)
20 px oraz marginesy wewnątrz tego obramowania.
c)
2 px oraz marginesy na zewnątrz tego obramowania.
d)
20 px oraz marginesy na zewnątrz tego obramowania.
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.

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

22.

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

23.

W języku CSS zapis postaci

h1::first-letter{color: red}

sprawi, że kolor czerwonego będzie

a)

Pierwsza linia paragrafu.

b)

tekst nagłówka pierwszego stopnia

c)

pierwsza litera nagłówka drugiego stopnia.

d)

pierwsza litera nagłówka pierwszego stopnia.

24.

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

25.

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

a)

text-style

b)

font-style

c)

font-weight

d)

text-decoration

26.

W przedstawionej definicji stylu CSS, powtarzanie dotyczy

body { background-image: url("rysunek.gif");

background-repeat: repeat-y;

a)

tła każdego ze znaczników akapitu.

b)

rysunku umieszczonego znacznikiem img.

c)

rysunku umieszczonego w tle strony w pionie.

d)

rysunku umieszczonego w tle strony w poziomie.

27.

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

h1{ font-style: oblique;

font-variant: small-caps;

text-align: right; }

a)
b)
c)
d)
28.

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%; }

29.

W folderze www znajdują się podfoldery html i style, w których zapisane są odpowiednio pliki z rozszerzeniem html i pliki z rozszerzeniem css. Chcąc dołączyć styl.css do pliku HTML należy użyć

a)

<link rel="Stylesheet" type="text/css" href="styl.css" />

b)

<link rel="Stylesheet" type="text/css" href="/style/styl.css" />

c)

<link rel="Stylesheet" type="text/css" href="www/style/styl.css" />

d)

<link rel="Stylesheet" type="text/css" href="../style/styl.css" />

30.

Chcąc sformatować w stylach CSS wszystkie obrazy zawarte w akapicie, powinno się użyć selektora

a)

p img

b)

p # img

c)

p + img

d)

p.img

31.

Który z atrybutów background-attachment w języku CSS należy wybrać, aby tło strony było nieruchome względem okna przeglądarki?

a)

Scroll

b)

Fixed

c)

Local

d)

Inherit

32.

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)
33.
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>
34.

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>

35.

Co oznacza skrót CSS

a)

Cascading Style Sheet

b)

Colorful Style Sheets

c)

Computer Style Sheets

d)

Creative Style Sheets

36.

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ść,}

37.

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

a)

>

b)

?

c)

*

d)

#

e)

.

38.

#blok {font-size:12pt;}

W przykładzie użyto selektora:

a)

klasy

b)

identyfikatora

c)

pseudoklasy

39.

Odsyłacz odwiedzony w CSS obsługuje pseudoklasa:

a)

:link

b)

:visited

c)

:active

d)

:hover

40.

Wskazanie kursorem myszy w CSS obsługuje pseudoklasa:

a)

:hover

b)

:link

c)

:active

d)

:focus

41.
W którym roku wprowadzono standard CSS3?
a)
1996.
b)
1998
c)
1999
d)
2001
42.
Styl linku po najechaniu kursorem myszki zmienimy w CSS używając selektroa:
a)
a:link
b)
a:visited
c)
a:hover
d)
a:above
43.

Poprawny zapis komentarza w pliku CSS to:

a)

/*komentarz w CSS */

b)

< komentarz w CSS >

c)

<! komentarz w CSS !>

d)

{ komentarz w CSS }

44.

chcąc sformatować linijki kodu 11,12,13 w css użyjemy znacznika klasy:

a)

#header

b)

.header

c)

header

d)

żadna odpowiedź nie jest prawidłowa

45.

formatowanie listy punktowej czyli linijek tekstu 18,19,20,21

a)

.ul li

b)

ul li

c)

#ul li

d)

li

46.

Prawidłowa nazwa identyfikatora w CSS to

a)

.id

b)

:id

c)

#id

d)

@id

47.

Wskaż prawidłowy zapis wartości stylu css

a)

10 px

b)

10-px

c)

10px

d)

10.px

48.

Który znacznik należy do znaczników definiujących listy w języku HTML?

a)

< tr >

b)

< th >

c)

< td >

d)

< ul >

49.

Wartości: static, relative, fixed, absolute oraz sticky można przypisać do właściwości

a)

display

b)

position

c)

list-style-type

d)

text-transform

50.

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;

}

51.

By dostosować stronę internetową dla niewidomych, należy nadać wyświetlanym za pomocą znacznika img obrazom atrybut

a)

alt

b)

src

c)

text

d)

style

52.

Tekst paragrafu, wyrównany w poziomie do środka, opisuje w CSS reguła

a)

vertical-align: middle 

b)

vertical-align: center

c)

text-align: center

d)

align: middle

53.

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: round;

}

b)

{

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

background-repeat: repeat;

}

c)

{

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

background-repeat: repeat-x;

}

d)

{

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

   background-repeat: repeat-y;}

54.

Witryna internetowa ma mieć przedstawioną strukturę bloków. Aby uzyskać ten układ, należy znacznikom sekcji przypisać właściwości w następujący sposób:

a)

float tylko 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

55.

W języku CSS zapisano wspólne formatowanie dla pewnej grupy znaczników. Formatowanie takich znaczników w kodzie HTML nastąpi przez atrybut

a)

style = "format1"

b)

id = "format1"

c)

div = "format1"

d)

class = "format1"

56.

Co oznacza jednostka "rem" w CSS?

a)

Jest to proporcjonalna jednostka do szerokości ekranu.

b)

Reprezentuje wielkość tekstu względem rozmiaru czcionki elementu nadrzędnego (root elementu).

c)

Jest to jednostka używana tylko do określenia wielkości marginesów.

d)

Jest to skrót od "relative em" i odnosi się do relatywnej wielkości tekstu w stosunku do elementu nadrzędnego.

57.

Która jednostka używa proporcji widoku, określającą 1% szerokości okna przeglądarki?

a)

em

b)

vw

c)

px

d)

cm

58.

Która jednostka reprezentuje 1/72 cala w CSS?

a)

px

b)

pt

c)

mm

d)

pc

59.

Która jednostka CSS jest skalowalna i zależy od ustawień użytkownika w przeglądarce dotyczących rozmiaru czcionki?

a)

px

b)

em

c)

mm

d)

cm

60.

Projektując stronę internetową, umieszczono kod definiujący jej styl. Jaką szerokość pozostawiono na treść strony?

a)

600px

b)

2px

c)

640px

d)

560px