Course Content
Introduction to CSS Part II
Now that we have gone over the background basics, some properties related to the background can be customized as required. Here is a detailed explanation of each property that can be set using the background shorthand property:
background-repeat
Specifies whether the background image should be repeated horizontally, vertically, or not at all. Valid values are repeat
, repeat-x
, repeat-y
, and no-repeat
. For example:
This prevents the background image from being repeated on the body element.
background-attachment
Specifies whether the background image should scroll with the rest of the page or stay fixed in place. Valid values are scroll
and fixed
. For example:
This sets the background image to stay fixed in place on the body element, even if the page is scrolled.
background-position
Specifies the position of the background image. This can be a keyword (such as center
, top
, or bottom
), a length
value, or a combination of the two. For example:
This centers the background image on the body element.
background-clip
Specifies whether the background image should be painted within the border box, padding box, or content box of an element. Valid values are border-box
, padding-box
, and content-box
. For example:
This sets the background image to be painted within the content box of the body element.
background-origin
Specifies the position of the background image within the element's background positioning area. Valid values are border-box
, padding-box
, and content-box
. For example:
This sets the background image to be positioned within the content box of the body element.
background-size
Specifies the size of the background image. This can be a keyword (such as cover
or contain
), a length value, or a combination of the two. For example:
This sets the background image to cover the entire body element.
Which of the following CSS color formats allows you to specify a color using hue, saturation, and lightness values?
Select the correct answer
Which of the following values can be used with the background-origin property to specify that the background image should be positioned relative to the border box of the element?
Select the correct answer
Which of the following is a valid CSS color format?
Select the correct answer
Section 2.
Chapter 5