wayground logo

Free Printable Worksheets

NEW

Font size

S
M
L
XL
Worksheets

Understanding CSS Selectors and Specificity

Total questions: 11

Worksheet time: 11mins

Name
Class
Date
1.

What is a CSS rule composed of?

a)

A selector and a property

b)

A selector and a declaration block

c)

A property and a value

d)

A declaration block and a value

2.

Which of the following is an example of an ID selector in CSS?

a)

.site-title

b)

#site-title

c)

site-title

d)

site-title#

3.

How do you select elements with a specific class in CSS?

a)

Using the hash (#) symbol

b)

Using the dot (.) symbol

c)

Using the colon (:) symbol

d)

Using the asterisk (*) symbol

4.

What does a pseudo-class selector allow you to do?

a)

Apply styles to an element based on its ID

b)

Apply styles to an element based on its class

c)

Apply styles to an element based on its state

d)

Apply styles to an element based on its tag

5.

Which of the following is an example of a pseudo-class selector?

a)

a:hover

b)

#hover

c)

.hover

d)

hover

6.

In the context of CSS, what is meant by "specificity"?

a)

The order in which CSS rules are written

b)

The importance of a CSS rule

c)

The precision of a CSS selector in targeting elements

d)

The number of properties in a CSS rule

7.

How would you select an `` element that is a descendant of a `

` element with the ID "bio"?

a)

section em#bio

b)

section#bio em

c)

#bio section em

d)

em section#bio

8.

Which of the following statements is true about CSS inheritance?

a)

All CSS properties are inherited by default

b)

Only properties related to text are inherited by default

c)

Inheritance is determined by the specificity of the selector

d)

Inheritance is determined by the order of the CSS rules

9.

What is the purpose of using descendant selectors in CSS?

a)

To apply styles to elements based on their ID

b)

To apply styles to elements based on their class

c)

To apply styles to elements that are nested within other elements

d)

To apply styles to elements based on their tag

10.

Given the following CSS code, what will be the background color of the <div> element?

```div { background-color: red; } div:hover { background-color: blue; } ```

a)

Red

b)

Blue

c)

Red when hovered, Blue otherwise

d)

Blue when hovered, Red otherwise

11.

Which of the following is a pseudo-class in CSS?

a)

:hover

b)

.hover

c)

#hover

d)

hover