Bootstrap Form Select

You can customize the native <select> with custom CSS that changes the element’s initial appearance.

Add class .form-select to trigger the custom styles to the <select> element. For example,

<select class="form-select" aria-label="Default select example">
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>

1. Sizing

You may also choose from small and large custom selects to match similarly sized text inputs. Set heights using classes like .form-control-lg and .form-control-sm.

2. Disabled

Add the disabled boolean attribute on a select to give it a grayed out appearance and remove pointer events.

Star InactiveStar InactiveStar InactiveStar InactiveStar Inactive