wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

CSS Font Property Quizziz

Total questions: 25

Worksheet time: 6hrs 1mins

Name
Class
Date
1.

Fill in the blanks to show text as Times New Roman with a background of cursive

<li style="​ (a)   :​​​ (b)   ​ (c)   ​ (d)   ​ (e)   "

Choose from the below words
font-family
'Times New Roman'
Cursive
font-style
font-type
.
Times New Roman
font
,
;
2.

Which CSS property is used to increase or decrease the text size of an element ?

a)

font-style

b)

text-size

c)

font-size

d)

text-style

3.

Match the fonts styles

a)

1.

Serif

b)

2.

Monospace

c)

3.

Sans Serif

d)

4.

Cursive

e)

5.

Fantasy

4.

What is the difference between italic and oblique fonts? Do most fonts have just one of them or both?

a)

There is no difference. Most fonts have just one or the other.

b)

Oblique fonts are just slanted but italic fonts are slanted and stretched/fancy. Most fonts have both.

c)

Italic fonts are just slanted but oblique fonts are slanted and stretched/fancy. Most fonts have both.

d)

Oblique fonts are just slanted but italic fonts are slanted and stretched/fancy. Most fonts have one or the other.

5.

Which CSS property is used to change the color of text?

a)

color

b)

text-color

c)

font-color

d)

background-color

6.

What is the default font weight of normal text?

a)

500

b)

400

c)

600

d)

700

7.

Which of the following is not a valid CSS font style?

a)

Normal

b)

Bold

c)

Oblique

d)

Italic

8.

Which CSS property is used with the value fantasy?

a)

font-family

b)

font-style

c)

font-weight

d)

font-size

9.

What is the CSS property to make text italic?

a)

text-decoration

b)

font-variant

c)

font-style

d)

font-weight

10.

Which of the following can you use to tell the computer the size of the font?

Select ALL that apply.

a)

vw

b)

rem

c)

%

d)

px

e)

sem

11.

Which of the following font sizes are relative?

Select ALL that apply.

a)

em

b)

rem

c)

%

d)

px

e)

vh

12.

Fill in the blanks to create the image:

<p style="_______:small-caps;">

a)

font-variant

b)

font-style

c)

font-weight

d)

font

13.

Fill in the blanks to create the image:

<p style="font-variant:____________;">

a)

all-caps

b)

small

c)

small-caps

d)

caps

14.

 If you wanted to use a Google Font, what do you need in the head section to make sure the font works?


a)

Link Element

b)

Title Element

c)

Meta Name Element

d)

Meta Charset Element

15.

 When you are adding a font that’s name has space(s) in it, which of the following could you use?

a)

"Times New Roman"

b)

[Times New Roman]

c)

{Times New Roman}

d)

(Times New Roman)

16.

Fill in the blank:

font-_______ is CSS's version of bold.

a)

weight

b)

style

c)

variant

d)

size

17.

Match the font size property with its definition.

a)

1/96 of an inch

1.

px

b)

font size of the parent element

2.

em

c)

font size of the root element

3.

rem

d)

1% of how tall the user screen is

4.

vh

e)

1% horizontal length of the user screen

5.

vw

18.

Which of the following declarations would style the words as shown in the picture?

a)

font:Papyrus

b)

font-style:Papyrus

c)

font-weight:Papyrus

d)

font-family:Papyrus

19.

Which of the following font size values are considered responsive?

Select ALL that apply.

a)

px

b)

em

c)

%

d)

vh

e)

vw

20.

What is the biggest weakness of using em to size your fonts?

a)

There isn't one.

b)

It can have nesting issues.

c)

There may be a zoom issue.

d)

It is very consistent across all devices.

21.

What is the biggest weakness of using vh to size your fonts?

a)

There isn't one.

b)

It can have nesting issues.

c)

There may be a zoom issue.

d)

It is very consistent across all devices.

22.

What is the advantage of using rem over em?

a)

There isn't one.

b)

It scaled to all screen sizes.

c)

There may be a zoom issue.

d)

It is very consistent across all devices.

23.

What ways have we learned to make text appear thicker?

Select ALL that apply.

a)

<b> tag

b)

<i> tag

c)

<em> tag

d)

<strong> tag

e)

font-weight property

24.

What ways have we learned to make text slanted and stretched?

Select ALL that apply.

a)

<b> tag

b)

<i> tag

c)

<em> tag

d)

<strong> tag

e)

font-style property

25.

Which of the following are font families (not individual fonts)?

Select ALL that apply.

a)

Arial

b)

Cursive

c)

Times New Roman

d)

Monospace

e)

Serif