Test Series - html

Test Number 70/72

Q: Which of the following centers tabs/pills?
A. .nav-justified
B. .nav nav-pills
C. .nav-stacked
D. .nav.navbar-nav
Solution: .nav-justified centers tabs/pills, on screens smaller than 786px the items are stacked and the content will remained centered, .nav nav-pills indicates a pill menu, .nav.navbar-nav contains list items with links inside navigation bar, .nav-stacked is for vertically stack tabs or pills.
Q: Which of the following is for title of the modal?
A. .modal-sm
B. .modal-title
C. .modal-open
D. .modal-lg
Solution: .modal-title is for the title of the modal, .modal-sm is for small modal, .modal-lg specifies large modal, .modal-open is used on  element to prevent page scrolling, .model-header shows header of the modal often contains a title and a close button.
Q: Which defines style for body of the modal?
A. .modal
B. .modal-content
C. .modal-body
D. .modal-dialog
Solution: .modal-body defines style for the body of the modal, we can add HTML markup here, .modal-content styles modal we can add modal’s header, body and footer, .modal-dialog sets the proper width and margin of the modal.
Q: Which of the following aligns media objects?
A. .media-body
B. .media
C. .media-list
D. .media-object
Solution: .media aligns media objects like images or videos often used for comments in a blog post, .media-body specifies the text that should appear next to media object, .media-list creates nested media lists, .media-object indicates a media object.
Q: Which of the following will provide additional information about something?
A. .item
B. .jumbotron
C. .label
D. .label-danger
Solution: .label adds a grey rounded box to the element, it provides additional information about something e.g. “New”, .jumbortron creates padded grey box with rounded corners that enlarge font sizes of text inside it, .item class added to each carousel item, it may be text or images.
Q: Which of the following is a container to enhance input by adding an icon?
A. .input-group-btn
B. .input-group-addon
C. .input-group
D. .input-group-lg
Solution: .input-group is a container to enhance an input by adding an icon, text or button in front or behind it as a “help text”, .input-group-lg is for large input group, .input-group-addon is used together with .input-group class, this makes it possible to add an icon or help text next to input field.
Q: Which of the following are the fades in a tab?
A. .in
B. .info
C. .initialism
D. .icon-prev
Solution: .in fades in tabs, .info adds a light-blue background to table row, it indicates neutral informative change or action, .initialism displays the text inside  element in a slightly smaller font size, .icon-prev specifies unicode icon used in corousels.
Q: Which of the following will add feedback icons for inputs?
A. .has-warning
B. .has-danger
C. .has-success
D. .has-feedback
Solution: .has-feedback adds feedback icons for inputs like checkmark, warning and error signs, .has-danger adds red color to label and red border to the input, as well as an error icon inside the input, .has-success adds green color to label and green border to input, as well as checkmark icon inside input.
Q: Which of the following will create hamburger menu?
A. .icon-next
B. .icon-bar
C. .icon-prev
D. .img-circle
Solution: .icon-bar is used in the navbar to create hamburger menu i.e. three horizontal bars, .icon-next creates Unicode icon, used in carousels, this is often replaced by glyphicon, .icon-prev is Unicode icon used in carousels, .img-circle shapes an image to a circle.
Q: Which of the following displays text inside  in slightly smaller font size:
A. .info
B. .input-group
C. .initialism
D. .in
Solution: .initialism displays text inside  element in slightly smaller font size, .input-group is a container to enhance input by adding an icon, text or button in front or behind it as a “help text”, .info adds light-blue background to table row, indicating a neutral informative change or action.

You Have Score    /10