Fundamentals of Front End Development MCQs with Answers
Practice important Fundamentals of Front End Development MCQs with answers and explanations.
Chapter: 178
Q1981:
What element should be used to create a list group with hyperlinks?
A. <ul>
B. <div>
C. <a>
D. <li>
Correct Answer:
B
Chapter: 178
Q1982:
Fill in the blank: To create a list group item with a heading and text, use the classes ____.
A. .list-group-item-title and .list-group-item-content
B. .list-group-item-heading and .list-group-item-text
C. .list-group-title and .list-group-description
D. .list-group-header and .list-group-body
Correct Answer:
B
Chapter: 178
Q1983:
Which class makes a list group item appear disabled?
A. .disabled
B. .inactive
C. .not-clickable
D. .no-access
Correct Answer:
A
Chapter: 178
Q1984:
Fill in the blank: To create a list group with custom HTML content, use the classes ____.
A. .list-group-item-custom and .list-group-content
B. .list-group-item-heading and .list-group-item-text
C. .list-group-item-body and .list-group-item-details
D. .list-group-item-extra and .list-group-item-elements
Correct Answer:
B
Chapter: 178
Q1985:
How can you add multiple badges to a single list group item?
A. Add multiple <span> elements with class .badge
B. Add multiple .badge classes to a single <span>
C. Use a <div> with multiple .badge classes
D. Add badges using <li> elements
Correct Answer:
A
Chapter: 178
Q1986:
Fill in the blank: To create a list group with items that are also links, use the <____> element instead of <ul>.
A. <div>
B. <a>
C. <li>
D. <span>
Correct Answer:
A
Chapter: 178
Q1987:
What class is used to color a list group item with a danger color?
A. .list-group-item-warning
B. .list-group-item-danger
C. .list-group-item-error
D. .list-group-item-alert
Correct Answer:
B
Chapter: 179
Q1988:
What class should be added to <input>, <textarea>, and <select> elements to apply Bootstrap's default styling?
A. .form-control
B. .form-style
C. .input-control
D. .text-input
Correct Answer:
A
Chapter: 179
Q1989:
Fill in the blank: To improve accessibility for people using screen readers, always use the attribute ____.
A. role="form"
B. class="form-control"
C. aria-label="form"
D. type="text"
Correct Answer:
A
Chapter: 179
Q1990:
Which class is used to create an inline form in Bootstrap?
A. .form-inline
B. .form-horizontal
C. .form-compact
D. .form-group
Correct Answer:
A
Chapter: 179
Q1991:
What additional class is required for labels in a horizontal form layout?
A. .form-control
B. .form-group
C. .control-label
D. .form-inline
Correct Answer:
C
Chapter: 179
Q1992:
Fill in the blank: Bootstrap's vertical form is the ____.
A. default
B. horizontal
C. inline
D. compact
Correct Answer:
A
Chapter: 179
Q1993:
How can you ensure form controls are left-aligned in an inline form?
A. Add the class .form-horizontal
B. Use the class .form-inline
C. Apply the class .form-left
D. Add class .form-group
Correct Answer:
B
Chapter: 179
Q1994:
Which form layout applies only to viewports that are at least 768px wide?
A. Vertical form
B. Horizontal form
C. Inline form
D. Compact form
Correct Answer:
C
Chapter: 179
Q1995:
Fill in the blank: To align labels and form controls in a horizontal layout, use Bootstrap's predefined ____.
A. grid classes
B. utility classes
C. form styles
D. alignment classes
Correct Answer:
A
Chapter: 179
Q1996:
What class makes all form elements inline and left-aligned?
A. .form-horizontal
B. .form-inline
C. .form-group
D. .form-left
Correct Answer:
B
Chapter: 179
Q1997:
Fill in the blank: In Bootstrap, for optimal spacing in forms, labels and form controls should be wrapped in a ____.
A. .form-inline
B. .form-group
C. .form-horizontal
D. .control-group
Correct Answer:
B
Chapter: 179
Q1998:
What is the default form layout in Bootstrap?
A. Vertical form
B. Horizontal form
C. Inline form
D. Compact form
Correct Answer:
A
Chapter: 180
Q1999:
What is the purpose of the data-ride="carousel" attribute in Bootstrap's Carousel component?
A. To specify the carousel's ID
B. To begin animating the carousel immediately
C. To add CSS transition effects
D. To define the carousel's slides
Correct Answer:
B
Chapter: 180
Q2000:
Fill in the blank: The class used to specify the wrapper for the carousel slides is ____.
A. .carousel-indicators
B. .carousel-inner
C. .carousel-caption
D. .carousel-controls
Correct Answer:
B