wayground logo

Free Printable Worksheets

NEW

Font size

S
M
L
XL
Worksheets

CSS - Cascading Style Sheets

Total questions: 25

Worksheet time: 13mins

Name
Class
Date
1.

Which of the following is the proper way to apply the CSS code inside style.css to the about.html file?

a)

Inside style.css:

applyTo {

href: about.html;

}

b)

Inside about.html:

<head>

<style href="style.css"></style>

</head>

c)

Inside style.css:

<html href="about.html">

d)

Inside about.html:

<head>

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

</head>

2.

You are trying to apply the same style to several different elements in a block, with line breaks before and after. Which tag should you use?

a)

<span>

b)

<div>

c)

<style>

d)

<src>

3.

Which of the following selects all elements with the class footer that are inside of divs?

a)

div {

.footer {

...

}

}

b)

.footer div {

...

}

c)

div > .footer {

...

}

d)

div .footer {

...

}

4.

Which of the following selects all a tags that are immediate children/child selector of div tags?

a)

div > a {

...

}

b)

...

}

c)

div < a {

...

}

d)

div + a {

...

}

5.

Why is it important to avoid repetitive code while creating a website?

a)

Excessive code is harder to read and understand

b)

It is easier to make edits to websites when CSS rules are strategically grouped and organized

c)

It demonstrates good coding style

d)

All of the above

6.

Which of the following will turn the first letter of all p elements blue?

a)

p::first-letter {

color=blue;

}

b)

p:first-letter {

color=blue;

}

c)

p::first-letter {

color: blue;

}

d)

p:first-letter {

color: blue;

}

7.

Which of the following selects images as the mouse hovers over them and sets their size to 350px by 350px?

a)

img:hover {

width: 350px;

height: 350px;

}

b)

img :hover {

width: 350px;

height: 350px;

}

c)

img::hover {

width: 350px;

height: 350px;

}

d)

img > hover {

width: 350px;

height: 350px;

}

8.

Which of the following settings will not make an element invisible?

a)

visibility: hidden

b)

appearance: off

c)

opacity: 0

d)

display: none

9.

True or False: Only CSS has online documentation because it is a more complex language than HTML.

a)

True

b)

False

10.

True or False: None of the changes you make in the Inspector will be saved.

a)

True

b)

False

11.

Which of the following defines border thickness so that the top and bottom borders are 10px thick and left and right borders are 5px thick?

a)

border: 5px 10px 5px 10px

b)

border: 5px 5px 10px 10px

c)

border: 10px 10px 5px 5px

d)

border: 10px 5px 10px 5px

12.

What is the proper CSS format for background color?

a)

back-ground color:orange:

b)

backgroundcolor-orange;

c)

background:color:orange;

d)

background-color:orange;

13.
What is the proper code to insert an image named "frog.jpg"?
a)
<img src="frog" width="104" height="142">
b)
<img="frog.jpg" width="104" height="142">
c)
<img src="frog.jpg" width="104" height="142">
d)
<img ="frog" width="104" height"142">
14.
Which line of code correctly places a gif image named "tiger" into a webpage?
a)
<img src="tiger" alt="BengalTiger" />
b)
<img gif=tiger alt="BengalTiger">
c)
<image source="tiger.gif" alt=BengalTiger" />
d)
<img src="tiger.gif" alt="BengalTiger" />
15.

Which is the correct CSS syntax?

a)

body {color: yellow;}

b)

body:color=yellow;

c)

{body:color= yellow;}

d)

{body;color: yellow;}

16.

What symbol should you use to target a class name in css?

a)

#

b)

()

c)

.

d)

class

17.

What symbol should you use to target an id in css?

a)

.

b)

+

c)

id

d)

#

18.

TRUE OR FALSE: CSS is used to style web pages

a)

True

b)

False

19.

How do you change the font color with CSS?

a)

font-color: green;

b)

color: green;

c)

change-font-color: green;

d)

fontcolor=green;

20.

TRUE OR FALSE: All tags require a closing tag.

a)

True

b)

False

21.

A type of style sheet language which is used in web design to describe the presentation of a document that is written in a markup language, such as HTML5. It is the code used to format the text in a webpage.

a)

Tag

b)

Meta Tag

c)

Comment

d)

CSS

22.
What does this mean:
#main { background-color: red; }
a)
The object with ID of main has a background colour of red
b)
The object with CLASS main has a background colour of red
c)
All objects on the page are red
d)
The body of the page is red
23.
What does this mean:
A:hover { color: blue; }
a)
Links are blue when you hover over them
b)
Animations are blue when you hover over them
c)
The background colour of the body is blue when hovered
d)
There is no blue allowed on the page
24.
Which of these is part of the Box model of CSS?
a)
DIV
b)
P
c)
TAG
d)
Padding
25.
What does CSS stand for?
a)
Cascading Style Sheet
b)
Communicative Styling Saved
c)
Colour Style Selector
d)
Comparitive Site Style