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: 46
Q521:
What is the purpose of the CSS class selector?
A. To apply styles to all elements with a specified class attribute.
B. To apply styles to specific HTML elements only.
C. To define HTML structure.
D. To select all HTML elements on a page.
Correct Answer: A
Chapter: 46
Q522:
What is the correct syntax to define a CSS class named "example"?
A. .class { property:value; }
B. #example { property:value; }
C. .example { property:value; }
D. *example { property:value; }
Correct Answer: C
Chapter: 46
Q523:
Which of the following HTML elements would be styled by the CSS class ".imp"?
A. Only <div> elements
B. All elements with class="imp"
C. Only <p> elements
D. Only <span> elements
Correct Answer: B
Chapter: 46
Q524:
How would you apply a class named "highlight" to a paragraph element in HTML?
A. <p.highlight> ... </p>
B. <p class="highlight"> ... </p>
C. <p class=highlight> ... </p>
D. <p:highlight> ... </p>
Correct Answer: B
Chapter: 46
Q525:
What will the following CSS rule do: `.imp {color:blue; font-size:14px}`?
A. It will make all elements with class "imp" have blue text and a font size of 14px.
B. It will apply a red color and font size of 14px to all elements.
C. It will apply blue color to only <div> elements.
D. It will set the font size to 14px for all <p> elements.
Correct Answer: A
Chapter: 46
Q526:
Can a class name start with a number?
A. No
B. Yes
C. No
D. Yes
Correct Answer: A
Chapter: 46
Q527:
Which CSS property in `.imp {color:blue; font-size:14px}` sets the text color?
A. font-size
B. color
C. margin
D. padding
Correct Answer: B
Chapter: 46
Q528:
What does `p.imp {color:blue; font-size:14px}` do?
A. It styles only <p> elements with the class "imp".
B. It styles all elements with the class "imp".
C. It styles all <p> elements on the page.
D. It styles only <div> elements with the class "imp".
Correct Answer: A
Chapter: 46
Q529:
Fill in the blank: In CSS, a class selector is written with a _____ before the class name.
A. #
B. .
C. *
D. &
Correct Answer: B
Chapter: 46
Q530:
Fill in the blank: You can use _____ characters for a class name, but it should not start with a number.
A. alphanumeric
B. only letters
C. special
D. uppercase
Correct Answer: A
Chapter: 47
Q531:
What is the primary purpose of using CSS for an image gallery?
A. To format text
B. To style images and arrange them visually
C. To create HTML elements
D. To add JavaScript functionality
Correct Answer: B
Chapter: 47
Q532:
Which of the following properties is commonly used to arrange images in a CSS image gallery?
A. text-align
B. display
C. flex
D. visibility
Correct Answer: C
Chapter: 47
Q533:
What CSS property is often used to ensure images in a gallery are displayed side by side?
A. flex-wrap
B. padding
C. overflow
D. flex-direction
Correct Answer: C
Chapter: 47
Q534:
How do you center-align images in a CSS image gallery?
A. Set margin to auto on the images
B. Set text-align to center on the container
C. Set display to inline-block on the images
D. Set the width of images to 100%
Correct Answer: A
Chapter: 47
Q535:
Fill in the blank: The `display: _____` property is used to make images appear in a flexible grid in a CSS image gallery.
A. block
B. inline
C. flex
D. fixed
Correct Answer: C
Chapter: 47
Q536:
Which CSS property is used to add space between images in a gallery?
A. margin
B. padding
C. border
D. width
Correct Answer: B
Chapter: 47
Q537:
To make images in a gallery responsive, you can set their `width` to _____ percentage.
A. 0.5
B. 1
C. 0.75
D. 0.25
Correct Answer: B
Chapter: 48
Q538:
What is the default display property for <li> elements in HTML?
A. block
B. inline
C. flex
D. none
Correct Answer: B
Chapter: 48
Q539:
What CSS property removes the bullets from a navigation list?
A. margin
B. padding
C. list-style-type
D. list-style
Correct Answer: B
Chapter: 48
Q540:
To make a horizontal navigation bar, what CSS property is used to display <li> elements in one line?
A. float
B. display
C. position
D. clear
Correct Answer: B

Test Your Knowledge

Take a timed quiz on Fundamentals of Front End Development

🚀 Start Quiz Now