Bootstrap Code Editor - v5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<h2 class='m-5'>Display</h2><div class='container pb-5'>
<h6>d-none</h6>
<div class='d-none'>.d-none </div>
<h6 class="mt-5">d-inline</h6>
<p>1. inline element occupy minimum required space<br/>2. height and width cannot set</p>
<div class="d-inline p-2 bg-primary text-white">d-inline</div>
<h6 class="mt-5">d-block (occupy all available space, height and width can set)</h6>
<span class="d-block p-2 bg-primary text-white">d-block</span>
<h6 class="mt-5">d-inline-block (use minimum required space, height and width can set)</h6>
<span class="d-inline-block p-2 bg-primary text-white">d-inline-block</span>
Bootstrap is one of the most popular frontend framework for web development. It has pre define CSS style and JS bundle for faster web page development.
This tool is using bootstrap version v5.3.3
You can select or search top most used code snippets and see the result. You also can write your own custom code in text editor and run code on fly, Try to resize preview panel from resize handler and see responsive behavior. Bootstrap CSS and JS library is loaded by default in preview panel so you no need to load files manually.