Google News
Bootstrap-4 Interview Questions
Use bootstrap 4 to create beautiful tables. Bootstrap 4 version has some new classes for inverting the table color and making the table responsive.

Table Dark : The .table-dark class adds a black background and white color fonts to the table
Table head : You can add a background color to the <thead> element by using either .thead-light or .thead-dark. 
The Bootstrap 4 forms are textual form controls like <input>, <textarea>, and <select> elements with class .form-control have a width of 100% by default. 

Horizontal form : Create horizontal forms with the grid by adding the .row class to form groups and using the .col-*-* classes to specify the width of your labels and controls.

Be sure to add .col-form-label to your <label>s as well so they’re vertically centered with their associated form controls. For <legend> elements, you can use .col-form-legend to make them appear similar to regular <label> elements.

Form and Label Sizing : To Use .col-form-label-sm or .col-form-label-lg to your <label>s to correctly follow the size of .form-control-lg and .form-control-sm.

And so many forms is there Inline Forms, Help text & Disabled Forms, Readonly plain text, etc,.

Bootstrap's included navigation components list into "tabs" and navigation "pills". To add a tab or nav pill, add the .nav class and either .nav-pills or .nav-tabs to a <ul> element containing the list of navigation items. 
Bootstrap 4 navbars is a simple and powerful, responsive navigation header, the navbar. Includes branding, navigation, and other elements into a navigation header,  including support for our collapse plugin.

A standard navigation bar is created with the .navbar class, followed by a responsive collapsing class { .navbar-expand-sm | -md |-lg | -xl  }.
Bootstrap 4 provides an easy way to create a stylized alert message box with its alert component. Alerts are created with the .alert class, followed by one of the 
contextual classes .alert-primary, .alert-success, etc,..

To create a bootstrap 4 badge, apply the .badge class, as well as one of the .badge-primary, .badge-secondary, etc,..

Button Badges : Badges can be used as part of links or buttons to provide a counter.
<button type="button" class="btn btn-primary"> Tutorials <span class="badge badge-light">14</span> </button>

Contextual Badges : The contextual classes (.badge-*) to change the color of a badge.
<span class="badge badge-default">Default</span>
<span class="badge badge-primary">Primary</span> etc,..

Pill Badges : Use the bootstrap 4 pill badges are add .badge-pill class to make the badges more round.
<span class="badge badge-pill badge-default">Default</span>
<span class="badge badge-pill badge-primary">Primary</span> etc,..
Bootstrap's cards provide a flexible and extensible content container with multiple variants and options. 

A bootstrap card it includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options.

For more examples please Click Here !.
Bootstrap 4 progress bars featuring support for stacked bars, animated backgrounds, and text labels. To create a default progress bar, add a .progress class to a container element and and the .progress-bar class to its child element.
Bootstrap 4 Pagination to indicate a series of related content exists across multiple pages. Add the .pagination class to an <ul> element. Then add the .page-item to each <li> element and a .page-link class to each link inside <li>.
Quickly configuring the position of an elements are .position-static, .position-relative, .position-absolute, .position-fixed, .position-sticky. Mainly three positions are there.

Fixed top : <div class="fixed-top">...</div>
Fixed bottom : <div class="fixed-bottom">...</div>
Sticky top : Position an element at the top of the viewport, from edge to edge, but only after you scroll past it. The .sticky-top utility uses CSS’s position: sticky, which isn’t fully supported in all browsers.

Microsoft Edge and IE11 will render position: sticky as position: relative.

<div class="sticky-top">...</div>.