1.3 CSS Background Properties

Question 1

What is the CSS shorthand property background controlling?

Answer 1

Background is shorthand CSS property sets
all background style properties at once

Question 2

What are 5 background properties?

C.O.I.R.S.

Answer 2

1. color,
2. origin,
3. image,
4. repeat
5. method,size,

Question 3

Can a background color be just words?

Answer 3

Yes, you can set a background color to a color name.

Question 4

Can you set a background to a hexadecimal color?

Answer 4

Yes

Question 5

What is a hexadecimal color?

Answer 5

It’s a precise system for labeling colors based on letters and numbers.

Question 6

Can a hexadecimal color have just 3 digits?

Answer 6

Yes

Just letters or just numbers

3 digits is shorthand for a color

Question 7

Can you use RGB for color specification?

Answer 7

Yes

Red, green, blue (RGB) can be
used to specify background color.

Question 8

What does the property background-image help you do?

Answer 8

It allows you to specify the URL of an
image to be used in the background.

Question 9

What are the 8 background properties?

Background is shorthand

CCAPRIS O

Answer 9

1. background-clip
2. background-color
3. background-attachment
4. background-position
5. background-repeat
6. background-image
7. background-size
8. background-origin

Question 10

Can a background have a gradient?

Answer 10

Yes

Question 11

What is a background image?

Answer 11

A background image uses a picture for the background.

Sets one or several background images for an element.

Question 12

What does background repeat do?

Answer 12

Background repeat controls whether or not the image
is tiled and how it gets tiled both vertically and horizontally.

Question 13

What does background position control?

Answer 13

Controls the background position of a background image.

Question 14

What’s the default for background image position?

Answer 14

By default, a background image’s initial position is the top-left corner of the containing element.

Question 15

What rules does background value of cover apply?

Answer 15

Cover tells the browser to make sure the image always covers the entire container, even if it has to stretch the image or cut a little bit off one of the edges.

Question 16

How does the value of contain differ from that of cover?

Answer 16

Shows the entire image

Contain stays within the boundaries.

Question 17

How do you use the property of background size to set size?

3 ways

Answer 17

Sets the size of a background image.

Keyword Values

1 Syntax

2 Syntax

Question 18

What does background-repeat do?

Answer 18

Controls whether or not the image is tiled and how it gets tiled both vertically and horizontally.

Question 19

What direction do repeated background images take?

Property: background-repeat

Answer 19

The property of background-repeat moves along Y and X, where

repeat-y repeats the image vertically,

while repeat-x repeats the background image horizontally.

Question 20

What graphic formats does background-image accept?

Answer 20

The background-image property in CSS applies a graphic (e.g. PNG, SVG, JPG, GIF, WEBP).

Question 21

Does the property of background-image accept gradients too?

Answer 21

Yes

You can use background-image property to set a gradient to the background of an element.

Question 22

How do you specify the background image source?

Answer 22

Using a URL, you can specify the location of the image.

Question 23

Are background properties combined?

Answer 23

Yes, you can have multiple background properties working together to create the desired effect.