Bootstrap Interview Questions

Practice for Bootstrap interviews by solving TestDome questions. Our interview questions are used by more than 6,000 companies and 450,000 individual test takers.

Jobseekers: Certify Your Knowledge

Take a Certification Test

Companies: Use Our Tests for Screening

Buy a Pack Of Candidates

Try to solve 4 Bootstrap interview questions below. Hints can help you find answers to questions you are having trouble with.

1. Modal Dialog

Modals Plugins
   
Easy  

The HTML page contains a button and modal dialog.

Using just Bootstrap's HTML attributes and no JavaScript, add attributes to the elements so that:

  1. When the Open button is clicked, the modal dialog is opened.
  2. When the Close button is clicked, the modal dialog is closed.
HTML5, CSS3, Bootstrap 4  
 


  •   Open button has correct attributes : Wrong answer
  •   Close button has correct attributes: Wrong answer
  •   Open button shows dialog: Wrong answer
  •   Close button hides dialog: Wrong answer


2. Tooltip

Plugins Tooltips
   
Easy  

Using only Bootstrap's style classes alter the anchor so that when mouse is hovered over it, the following tooltip is displayed:

A bootstrap hover-over effect.

HTML5, CSS3, Bootstrap 4  
 


  •   Tooltip visibility: Wrong answer
  •   Tooltip location: Wrong answer
  •   Tooltip contents: Wrong answer


3. Warning Button

Buttons Styling
   
Easy  

Using only Bootstrap classes, write the HTML markup to display a Button that looks like this.

The image icon URL is 'https://tinyurl.com/qqmbrex'.

HTML5, CSS3, Bootstrap 4  
 


  •   Button text: Wrong answer
  •   Button type and image: Wrong answer
  •   Button shape: Wrong answer
  •   Button color: Wrong answer


4. Test Links

Grid layout
   
Hard  

Using Bootstrap classes, modify the div element with the id "links" so that on extra small resolutions (<576px), each link and ad takes one whole row. It should look like this:

On small resolutions and higher (≥576px), both links should take one half of the row and the ads should be invisible. It should look like this:

HTML5, CSS3, Bootstrap 4  
 


  •   Each element takes the whole screen width on extra small screens: Wrong answer
  •   Links are in the same row on larger screens: Wrong answer
  •   Each link takes half the screen width on larger screens: Wrong answer
  •   Ads are invisible on larger screens: Wrong answer


If you feel ready, take one of our timed public Bootstrap Interview Questions tests:
HTML/CSS

HTML/CSS and Bootstrap Online Test (Easy / Hard)

HTML/CSS, JavaScript with jQuery, and Bootstrap Online Test (Easy / Hard)

HTML/CSS, JavaScript, and Bootstrap Online Test (Easy / Hard)

Not exactly what you are looking for? Go to our For Jobseekers section.