BOOTSTRAP

BOOTSTRAP –

1) What exactly is a Bootstrap?

Answer: Bootstrap is basically a front-end framework that is commonly or mostly used to create HTML, CSS, and Java script based web applications(Applications that mostly run on browser).The system which is used by bootstrap is very responsive, fast, and easy to use. It mainly focuses on building mobile, web and desktop applications using relatable design templates. You can also create vary good interactive components like drop-downs, forms, buttons, button groups, alerts, cards, tabs, and many more components.

2) Why Bootstrap is mainly used for developing mobile applications?

Answer: It is used for developing mobile applications because it has several responsive features like media queries and design templates that are easy to use. In other terms, it is mainly built for Mobile Applications.

For Free Demo classes Call: 8237077325
Registration Link: Click Here!

3) What are the main features of Bootstrap 5?

Answer: 

• Freeware and open-source.
• Compatible / works with almost all modern browsers like Google Chrome, Firefox, Safari, Opera, and Internet Explorer.
• Responsive features using Media Queries.
• Easy to use and Understand.
• Lightweight.
• Consists of several components(toasts, nabber, etc) and utilities.
• Has Support for jQuery plugins.
• Can be easily modified.
• Mobile-friendly.
• Simple integration with other technologies.
• Very Good documentation support.
• There is a Availability of a very large number of templates, themes, and plugins.

4) Name key components of Bootstrap 5?

Answer: Its key components include:

• Toasts
• Navbar
• Popovers, etc.

5) Name the classes that are used with the buttons in bootstrap?

Answer: The list of the classes used with bootstrap buttons are:-

• The  btn btn-primary class
• The  btn btn-secondary class
• The  btn btn-success class
• The  btn btn-danger class
• The  btn btn-warning class
• The  btn btn-info class
• The  btn btn-white class
• The  btn btn-light class
• The  btn btn-dark class

6) What are the different button styles which are available in Bootstrap5?

Answer: In Bootstrap 5, there are lots of styles that we can use with the buttons.

Some of them are:

• Buttons that can be used with colors
• Buttons that can be with a colored outline
• Buttons that can be Small buttons
• Buttons that can be Large buttons
• Buttons that can be Block-level buttons
• Buttons that can be Button links

7)What is the use of alerts in Bootstrap?

Answer: The alerts in bootstrao are technically used to create some important alert messages, which can add styles to make the messages more noticeable or more clearer to the user.

For Free Demo classes Call: 8237077325
Registration Link: Click Here!

The following are the contextual classes can be used to create colourful alerts:

• The dot alert-primary class
• The dot alert-secondary class
• The dot alert-success class
• The dot alert-danger class
• The dot alert-warning class
• The dot alert-info class
• The dot alert-light class
• The dot alert-dark class

8)Do you think is there any relationship between Bootstrap and JavaScript Language?

Answer: Yes, there is a relationship between the two technologies i.e Bootstrap and Javascript. But some of the components available in Bootstrap require JavaScript to work properly.

Some of the components that require JavaScript are shown in the below list:

• Alerts – To close alerts that are triggered
• Buttons – To toggle buttons on and off
• Checkbox – To evaluate the checkbox functionality
• Radio button –To evaluate the  radio button functionality
• Carousels – To evaluate the sliding behaviour of carousels
• Dropdowns – To evaluate the displaying and positioning dropdowns
• Modals – To evaluate the displaying, positioning, and scrolling modals
• Navbar – To basically extend and collapse plugin to implement responsive behaviour
• Toasts – To evaluate the displaying and dismissing of toasts
• Tooltips – To evaluate the displaying and positioning tooltips
• Popovers – To evaluate the displaying and positioning popovers
• Scrollspy –To evaluate the scrolling behaviour and navigation updates

9)What is the code basically required to enable popover in Bootstrap 5?

Answer:

var popoverTriggerList = [].slice.call(document.querySelectorAll(‘[data-bs-toggle=”popover”]’))

var popoverList = popoverTriggerList.map(function (popoverTriggerEl) {

  return new bootstrap.Popover(popoverTriggerEl)

})

 

(OR we can use the other way)

 

var popover = new bootstrap.Popover(document.querySelector(‘.example-popover’), {

  container: ‘body’

})

For Free Demo classes Call: 8237077325
Registration Link: Click Here!

10)Explain how Dropdowns and Button Groups in Bootstrap 5 which is a part of version 5? 

Answer: A dropdown is basically a dynamic toggle menu that contains a list of list items under it. It is one of the most cleanest design elements of a website. 

The syntax to use these Dropdowns is:

 

<div class= “dropdown”><!– have your list in this with the class .dropdown-menu –></div>

 

Button Groups are the series of buttons placed in an adjacent manner. This Bootstrap version 5 which is version 5, that component requires that division elements with dot btn-group class be defined first. After that, the button elements are nested using dot btn class.

 

The syntax is as follows:

 

<div class=“btn-group”><button class= “btn”>Correct</button></div>

 

<div class=“btn-group”><button class= “btn”>Wrong</button></div>

 

Using the above two written components, we can create a new component called the Button Dropdown that would enable the programmer to trigger a dropdown by just using a button element. 

 

Syntax:

 

<button class = “btn-default dropdown-toggle”><!— the dropdown component goes here –></button>

Author:-

Uday Kiran 

SevenMentor Pvt Ltd

Call the Trainer and Book your free demo Class for now!!!
call icon

© Copyright 202! | Sevenmentor Pvt Ltd.