Bootstrap 5 Close button Disabled state

Bootstrap 5 Close button Disabled state is used to disable the close button for dismissing content like modals and alerts. The disabled close button changes the opacity and removes the pointer cursor on hovering.

Close Button Disabled State used Attribute: 

• <disabled: The disabled attribute is used to disable the close button.

Syntax:

<button type="button" class="btn-close" 
 disabled aria-label="Close">
 ...
</button>

 

Example 1: In this example, we will create a simple disabled button.

Output:

👁 Image

Example 2: In this example, we will use a disabled close button in a Modal.

Output:

👁 Image

References: https://getbootstrap.com/docs/5.0/components/close-button/#disabled-state