curriculum/challenges/english/blocks/quiz-css-backgrounds-and-borders/66ed8fd7f45ce3ece4053eb0.md
To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
Which CSS property is used to specify the image to be used as a list item marker?
list-style-position
background-image
content-image
list-style-image
Which property is used to control the position of the list item marker?
list-style-type
list-position
position-marker
list-style-position
What does the line-height property do?
It is used to set the background size for an element.
It is used to style links that have not been visited by the user.
It is used to create space to the right of list items.
It is used to create space between lines of text.
Which pseudo-class is used to style links when a user hovers over them?
:hovered
:hovering
:hasHovered
:hover
What is the default value for the background-repeat property?
no-repeat
repeat-x
space
repeat
Which CSS property can be used to control the size of a background image?
image-size
background-fit
size-image
background-size
Which of the following is the correct way to apply a solid red top border to an element?
set-top-border: 3px solid red;
border-top: apply 3px solid red;
top-border: 3px solid red;
border-top: 3px solid red;
Which of the following is NOT a valid border property?
border-bottom
border-right
border-top
border-side
Which of the following is a valid border-style value?
wave
triple
zig zag
dotted
Which of the following is the correct way to apply borders using the shorthand property?
.box {
borders: 1px solid black;
}
.box {
borderShort: 1px solid black;
}
.box {
border-short: 1px solid black;
}
.box {
border: 1px solid black;
}
What is the role of the linear-gradient function?
It is used to set the style of an element's border.
It is used to determine how background images should be repeated along the horizontal and vertical axes.
It is used to style an element that was activated by the user.
It is used to create a transition between multiple colors along a straight line.
Which value for the background-repeat property ensures the image repeats horizontally but not vertically?
repeat-y
space
no-repeat
repeat-x
What is the purpose of the border-radius property?
To create shadows around the border.
To change the width of the border.
To make the border disappear.
To round the corners of an element.
Which of the following is NOT a valid value for the background-position property?
top
center
bottom
side
Which of the following background-repeat values can be used to repeat a background image vertically?
repeat-x
vertical-only
stretch
repeat-y
What does background-position: center; do to a background image?
It aligns the background image to the top of the element.
It repeats the background image horizontally and vertically.
It scales the background image to fill the entire element.
It positions the background image in the center of the element.
Which of these is NOT a valid border value?
1px solid black
3px dotted blue
2px dashed red
5px inverted green
What does the radial-gradient function do?
It creates a background that transitions between multiple colors along a straight line.
It specifies whether the background image should scroll with the content or remain fixed in place.
It is used to style an element that was activated by the user.
It creates an image that radiates from a particular point and gradually transitions between multiple colors.
Which of the following is NOT a valid pseudo-class?
:focus
:visited
:link
:before
Which of the following shows the background shorthand property being used properly?
body {
background: apply url("example-url-goes-here");
}
body {
background: set url("example-url-goes-here");
}
body {
background: 2px solid red url("example-url-goes-here");
}
body {
background: no-repeat url("example-url-goes-here");
}
What kind of values can the line-height property accept?
Only pixel values
Only keyword values like inherit
Only em units
Numbers, percentages, and length units
Which of the following is not a valid value for line-height?
normal
150%
2em
bold
What does list-style-type control?
The position of a list marker
The spacing of list items
The alignment of list items
The marker symbol used in a list
Which value is not valid for list-style-type?
circle
disc
square
hexagon
What are the two acceptable values for list-style-position?
top and bottom
inline and block
left and right
inside and outside
Which CSS property adds spacing outside each list item to improve readability?
padding
line-height
text-indent
margin
What does the :link pseudo-class target?
All hyperlinks
Hovered links
Already visited links
Unvisited links
What pseudo-class styles a link when the user has already clicked on it?
:hover
:link
:focus
:visited
Which pseudo-class styles an element when it gains input focus?
:hover
:visited
:target
:focus
When does the :active pseudo-class apply?
When the link is first loaded
When the user is not interacting
When the browser finishes rendering
When a user clicks or taps the element
Which pseudo-class is used for hover effects?
:link
:click
:active
:hover
What does background-size: cover do?
Repeats the image in all directions
Crops the image
Fixes the image in one position
Scales the image to fill the element while preserving aspect ratio
Which value of background-repeat will repeat the background image both horizontally and vertically?
no-repeat
repeat-x
space
repeat
Which property sets where the background image is placed?
background-location
background-origin
background-place
background-position
What value of background-attachment keeps the image fixed when scrolling?
scroll
static
sticky
fixed
Which of the following correctly sets a background image that doesn’t repeat and is centered?
background: no-repeat-center img("img.png");
background: image url("img.png") center;
background-position: center no-repeat url("img.png");
background: center no-repeat url("img.png");
Which property is used to set the top, right, bottom, and left borders in a single declaration?
border-style
border-radius
outline
border
What effect does setting border-radius: 10px; have on an element?
It changes the border's opacity
It creates a 10-pixel border
It adds a 10px shadow
It rounds the corners of the element
Which of the following CSS rules correctly creates a linear gradient from red to yellow?
background: gradient-linear(red to yellow);
background: linear(red, yellow);
background-color: gradient(red, yellow);
background: linear-gradient(red, yellow);
Which of the following CSS declarations correctly applies a radial gradient from white in the center to blue at the edges?
background: linear-gradient(white to blue);
background: gradient-radial(white to blue);
background: radial-gradient(blue, white);
background: radial-gradient(white, blue);