Skip to main content

Fundamentals of Front End Development MCQs with Answers

Practice important Fundamentals of Front End Development MCQs with answers and explanations.

Chapter: 157
Q1761:
Which of the following CSS properties can be animated using transitions?
A. font-size
B. margin
C. width
D. All of the above
Correct Answer: D
Chapter: 157
Q1762:
Fill in the blank: To specify a custom speed curve for a transition, use the transition-timing-function property with the value ______.
A. ease
B. linear
C. cubic-bezier(n,n,n,n)
D. ease-in
Correct Answer: C
Chapter: 157
Q1763:
Which value for transition-timing-function results in a transition effect with a slow start and end?
A. ease-in-out
B. ease
C. linear
D. ease-in
Correct Answer: A
Chapter: 157
Q1764:
Fill in the blank: To delay a transition effect by 2 seconds, use transition-delay: ______;
A. 2s
B. 2s ease
C. 2s linear
D. 2s delay
Correct Answer: A
Chapter: 157
Q1765:
Which of the following properties can you use with transition to create a smooth change?
A. border
B. height
C. background-color
D. All of the above
Correct Answer: D
Chapter: 157
Q1766:
Fill in the blank: To apply a transition effect that changes the width and height with different durations, use transition: ______;
A. width 2s, height 4s
B. width 4s, height 2s
C. width 2s
D. height 4s
Correct Answer: A
Chapter: 157
Q1767:
Which property is used to apply a delay before a transition effect begins?
A. transition-delay
B. transition-timing-function
C. transition-duration
D. transition-property
Correct Answer: A
Chapter: 157
Q1768:
Fill in the blank: The transition property in CSS3 must include at least ______.
A. The property to be transitioned
B. The color to be changed
C. The duration of the effect
D. The timing function
Correct Answer: C
Chapter: 158
Q1769:
What is the purpose of CSS3 animations?
A. To change font styles
B. To animate HTML elements without JavaScript
C. To modify element dimensions
D. To add background images
Correct Answer: B
Chapter: 158
Q1770:
Fill in the blank: To define the styles an element will have at certain times, use the ______ rule.
A. @keyframes
B. @animations
C. @transitions
D. @styles
Correct Answer: A
Chapter: 158
Q1771:
Which property specifies the number of times an animation should run?
A. animation-duration
B. animation-name
C. animation-iteration-count
D. animation-delay
Correct Answer: C
Chapter: 158
Q1772:
Fill in the blank: To specify a delay before an animation starts, use the ______ property.
A. animation-duration
B. animation-delay
C. animation-name
D. animation-iteration-count
Correct Answer: B
Chapter: 158
Q1773:
Fill in the blank: The animation-timing-function property can be set to ______ for a constant speed from start to end.
A. ease
B. linear
C. ease-in
D. ease-out
Correct Answer: B
Chapter: 158
Q1774:
What does the animation-name property define?
A. The speed of the animation
B. The style changes during the animation
C. The name of the animation to use
D. The duration of the animation
Correct Answer: C
Chapter: 158
Q1775:
Fill in the blank: To add multiple keyframes in an animation, use percentages such as 0%, 25%, 50%, and ______.
A. 1
B. 0.75
C. 0.5
Correct Answer: A
Chapter: 158
Q1776:
Which property would you use to control how an animation runs in reverse or alternate cycles?
A. animation-direction
B. animation-name
C. animation-delay
D. animation-iteration-count
Correct Answer: A
Chapter: 158
Q1777:
Fill in the blank: To run an animation for a duration of 6 seconds, specify animation-duration: ______;
A. 6s
B. 6ms
C. 6m
D. 6s ease
Correct Answer: A
Chapter: 158
Q1778:
What effect does the ease-out value have on the animation-timing-function?
A. Animation starts fast and ends slowly
B. Animation starts slowly and ends fast
C. Animation has a constant speed
D. Animation speeds up gradually
Correct Answer: A
Chapter: 158
Q1779:
Fill in the blank: To create an animation with a slow start and end, use animation-timing-function: ______;
A. ease-in-out
B. linear
C. ease-in
D. ease-out
Correct Answer: A
Chapter: 159
Q1780:
What property specifies the number of columns an element should be divided into?
A. column-gap
B. column-count
C. column-width
D. column-span
Correct Answer: B

Test Your Knowledge

Take a timed quiz on Fundamentals of Front End Development

🚀 Start Quiz Now