The .d-none and .d-block classes in Bootstrap are used for controlling the visibility of elements. .d-none hides the element by default, while .d-block displays it as a block-level element.

Syntax:

<div class="d-none">Hidden content</div>
<div class="d-block">Visible content</div>

Explanation: (.d-none) class sets the element’s display property to ‘none’, making it invisible on the webpage. Conversely,
.d-block class sets the display property to ‘block’, rendering the element as a block-level element, causing it to appear on the webpage. These classes provide a simple way to toggle the visibility of elements in Bootstrap-based projects.

Features:

• .d-none hides the element by setting its display property to ‘none’.
• .d-block displays the element as a block-level element, making it visible.
• These classes are part of Bootstrap’s utility classes for controlling visibility.
• They offer a straightforward way to toggle the visibility of elements on the webpage.

Ref: /archive/bootstrap-5-display/