MCQs > IT & Programming > Bootstrap MCQs > Basic Bootstrap MCQs

Basic Bootstrap MCQ

1. Bootstrap provides a basic page structure with __ System

Answer

Correct Answer: Grid

Note: This Question is unanswered, help us to find answer for this one

2. Which of the following is not a default Bootstrap grid system class?

Answer

Correct Answer: xl

Note: This Question is unanswered, help us to find answer for this one

3. The typographic scale in Bootstrap is based on which of the following Less variables:

Answer

Correct Answer: @font-size-base
@line-height-base

Note: This question has more than 1 correct answers

Note: This Question is unanswered, help us to find answer for this one

4. How to create a progress bar using Bootstrap 3?

Answer

Correct Answer: <div class="progress"> <div class="progress-bar" style="width: 60%;">60%</div> </div> 

Note: This Question is unanswered, help us to find answer for this one

5. Which is the correct way to create full-width layout with two columns ⅓ and ⅔ on all devices?

Answer

Correct Answer: <div class="container-fluid"> <div class="row"> <div class="col-xs-4">One</div> <div class="col-xs-8">Two</div> </div> </div>

Note: This Question is unanswered, help us to find answer for this one

6. How to wrap series of buttons?

Answer

Correct Answer:


Note: This Question is unanswered, help us to find answer for this one

7. When we are adding .img-responsive class to an image, which of the following CSS-properties are applied on that image?

Answer

Correct Answer: display: block
max-width: 100%

Note: This question has more than 1 correct answers

Note: This Question is unanswered, help us to find answer for this one

8. When you are using Active tabs, which of the following is the correct code to Select tab by name?

Answer

Correct Answer: $('#myTab a[href=

Note: This Question is unanswered, help us to find answer for this one

9. Which of the following LESS variables does not exist?

Answer

Correct Answer: @inputBorderColor

Note: This Question is unanswered, help us to find answer for this one

10. Which of the following LESS variables can be used to define your own number of columns in the grid? ing is

Answer

Correct Answer: @grid-columns

Note: This Question is unanswered, help us to find answer for this one

11. How do you pass data to a modal in Bootstrap ?

Answer

Correct Answer: $('#modal_example').on('show.bs.modal', function(e) { var myId = $(e.relatedTarget).data('my-id'); $(e.currentTarget).find('input[name=

Note: This Question is unanswered, help us to find answer for this one

12. Is it possible to hide something from print view just by using Bootstrap CSS classes?

Answer

Correct Answer: Yes

Note: This Question is unanswered, help us to find answer for this one

13.

What are the correct ways to activate tab? (choose all that apply)

Answer

Correct Answer: $('#myTab li:eq(2) a').tab('show');)
$('#myTab a:first').tab('show');
$('#myTab a:last').tab('show');
$('#myTab a[href="#profile"]').tab('show');

Note: This question has more than 1 correct answers

Note: This Question is unanswered, help us to find answer for this one

14.

The following event is fired when the carousel has completed its slide transition:

Answer

Correct Answer: $(‘identifier’).on (‘slid.bs.carousel’, function () { // do something… })

Note: This Question is unanswered, help us to find answer for this one

15.

Which plugin is used to create a modal window?

Answer

Correct Answer: Modal

Note: This Question is unanswered, help us to find answer for this one

16.

Which of the following is a valid method in Carousel plugin?

Answer

Correct Answer: .carousel('cycle')

Note: This Question is unanswered, help us to find answer for this one

17.

Which Contextual classes will allow you to change the background color of your table rows or individual cells? (choose all that apply)

Answer

Correct Answer: .active: Applies the hover color to a particular row or cell
.success: Indicates a successful or positive action

Note: This question has more than 1 correct answers

Note: This Question is unanswered, help us to find answer for this one

18.

Which class indicates uppercased text?

Answer

Correct Answer: .text-uppercase

Note: This Question is unanswered, help us to find answer for this one

19.

True or False:- "Use of data attributes from multiple plugins on the same element is not recommended."

Answer

Correct Answer: True

Note: This Question is unanswered, help us to find answer for this one

20.

What is Bootstrap's global default font-size?

Answer

Correct Answer: 14px

Note: This Question is unanswered, help us to find answer for this one

21.

Which contextual class indicates a dangerous or potentially negative action?

Answer

Correct Answer: .text-danger

Note: This Question is unanswered, help us to find answer for this one

22.

Which of the following LESS variables related for buttons?

Answer

Correct Answer: @btnDangerBackground

Note: This Question is unanswered, help us to find answer for this one

23.

Which class adds a heading to a panel?

Answer

Correct Answer: .panel-heading

Note: This Question is unanswered, help us to find answer for this one

24.

Is it possible to change the shape of image file?

Answer

Correct Answer: Only visual output can be changed

Note: This Question is unanswered, help us to find answer for this one

25.

Which tag can be used for quoting blocks of content from another source within your document?

Answer

Correct Answer: blockquote>

Note: This Question is unanswered, help us to find answer for this one

26.

Which plugin is used to cycle through elements, like a slideshow?

Answer

Correct Answer: Carousel

Note: This Question is unanswered, help us to find answer for this one

27.

Which of the following LESS variables does not belong to the Navbar component?

Answer

Correct Answer: @navbar-default-height

Note: This Question is unanswered, help us to find answer for this one

28.

Which dynamic style sheet language are supported for Bootstrap?

Answer

Correct Answer: Both of the above

Note: This Question is unanswered, help us to find answer for this one

29.

In Bootstrap, collapsing elements enables you to _____ any particular element without writing any JavaScript code or the accordion markup?

Answer

Correct Answer: Collapse

Note: This Question is unanswered, help us to find answer for this one

30.

Which contextual class indicates a successful or positive action?

Answer

Correct Answer: .text-success

Note: This Question is unanswered, help us to find answer for this one

31.

What are mixins?

Answer

Correct Answer: Mixins allow document authors to define patterns of property value pairs, which can then be reused in other rulesets.

Note: This Question is unanswered, help us to find answer for this one

32.

Which of the following bootstrap style is used to create a .navbar that scrolls with the page?

Answer

Correct Answer: .navbar-static-top

Note: This Question is unanswered, help us to find answer for this one

33.

Is it possible to change table's outline color using Less variables?

Answer

Correct Answer: Not possible

Note: This Question is unanswered, help us to find answer for this one

34.

Which of the following are valid events in Toggle plugin?

Answer

Correct Answer: show.bs.dropdown

Note: This Question is unanswered, help us to find answer for this one

35.

Which of the following will correctly call collapse?

Answer

Correct Answer: $(‘#myCollapsible).collapse({ toogle: false })
All of these

Note: This question has more than 1 correct answers

Note: This Question is unanswered, help us to find answer for this one

36.

Which of the following bootstrap classes can be used to create an animated progress bar?

Answer

Correct Answer: .active

Note: This Question is unanswered, help us to find answer for this one

37.

Which of the following code can be used to produce sticky footer?

Answer

Correct Answer: <div class="footer navbar-fixed-bottom">

Note: This Question is unanswered, help us to find answer for this one

38.

How to attach navbar to top of window which scrolls away with the page?

Answer

Correct Answer: <nav class="navbar navbar-default navbar-static-top"></nav>

Note: This Question is unanswered, help us to find answer for this one

39.

How is an underlined text made?

Answer

Correct Answer: By adding <u> tag around the text

Note: This Question is unanswered, help us to find answer for this one

40.

A standard navigation tab is created with:

Answer

Correct Answer: <ul class="nav nav-tabs">

Note: This Question is unanswered, help us to find answer for this one

41.

Which of the following is not a Bootstrap component?

Answer

Correct Answer: Script

Note: This Question is unanswered, help us to find answer for this one

42.

How can you create disabled link in the Nav component?

Answer

Correct Answer: <ul class="nav nav-pills"> <li class="active"><a href="#">Home Page</a></li> <li><a href="#">About Page</a></li> <li><a href="#">Service Page</a></li> <li class="disabled"><a href="#">Contact Page</a></li> </ul>

Note: This Question is unanswered, help us to find answer for this one

43.

Which of the following are not Bootstrap plugins?

Answer

Correct Answer: datepicker

Note: This Question is unanswered, help us to find answer for this one

44.

Which of the following is not a Bootstrap plugin?

Answer

Correct Answer: Menubox

Note: This Question is unanswered, help us to find answer for this one

45.

Which plugin is used to create a tooltip?

Answer

Correct Answer: Tooltip

Note: This Question is unanswered, help us to find answer for this one

46.

Which of the following can be used to call a dialog?

Answer

Correct Answer: $(‘#myModal’).modal();

Note: This Question is unanswered, help us to find answer for this one

47.

How to display block only for extra small devices?

Answer

Correct Answer: .visible-xs-*

Note: This Question is unanswered, help us to find answer for this one

48.

What is the default gutter width set by Bootstrap?

Answer

Correct Answer: 30px

Note: This Question is unanswered, help us to find answer for this one

49.

Which option should be set to make modal window closable on pressing ESC key?

Answer

Correct Answer: Set the option “keyboard” to true

Note: This Question is unanswered, help us to find answer for this one

50.

What is default grid float breakpoint set by Bootstrap?

Answer

Correct Answer: 768px

Note: This Question is unanswered, help us to find answer for this one

51.

What is the correct way to center align text inside the paragraph?

Answer

Correct Answer: p class="text-center">Center aligned text./p>

Note: This Question is unanswered, help us to find answer for this one

52.

How many methods scrollspy plugin has?

Answer

Correct Answer: 1

Note: This Question is unanswered, help us to find answer for this one

53.

How can you make a text which is aligned by left margin, adjusted letter & word-spacing so that the text falls flush with the both margins (left and right)?

Answer

Correct Answer: Add class .text-justify to some tag

Note: This Question is unanswered, help us to find answer for this one

54.

The default Bootstrap grid system utilizes ____ columns.

Answer

Correct Answer: 12

Note: This Question is unanswered, help us to find answer for this one

55.

How can you add a footer to a panel?

Answer

Correct Answer: By adding .panel-footer class to <div> tag

Note: This Question is unanswered, help us to find answer for this one

56.

What options are available during initialization of carousel? (choose all that apply)

Answer

Correct Answer: interval
pause

Note: This question has more than 1 correct answers

Note: This Question is unanswered, help us to find answer for this one

57.

Which of the following are available classes for containers in Bootstrap 3? Check all that apply.

Answer

Correct Answer: container
container-fluid

Note: This question has more than 1 correct answers

Note: This Question is unanswered, help us to find answer for this one

58.

How can you make a smaller text inside an h1 tag?

Answer

Correct Answer: Wrap some text inside h1 with tag
Wrap some text inside h1 with tag and add class .small

Note: This question has more than 1 correct answers

Note: This Question is unanswered, help us to find answer for this one

59.

Which of the following initializes a Bootstrap modal?

Answer

Correct Answer: All of the above

Note: This Question is unanswered, help us to find answer for this one

60.

How is an interactive table made, where the user can hover the row and the row gets different background?

Answer

Correct Answer: Add .table and .table-hover classes to <table> tag

Note: This Question is unanswered, help us to find answer for this one

61.

Which of the following is the correct css class which offsets a div by 2 columns in small viewport?

Answer

Correct Answer: col-sm-offset-2

Note: This Question is unanswered, help us to find answer for this one

62.

Which tool is used to compile Less styles for Bootstrap?

Answer

Correct Answer: grunt

Note: This Question is unanswered, help us to find answer for this one

63.

The following event is fired when the alert has been closed (it will wait for CSS transitions to complete)?

Answer

Correct Answer: $('alertexample').bind('closed.bs.alert', function () { // do something... })

Note: This Question is unanswered, help us to find answer for this one

64.

How are striped rows for the table using bootstrap classes to support IE8+, Chrome, Firefox and Safari made?