Bootstrap Form Select

You can customize the native <select> with custom CSS that changes the element's initial appearance. Just, add the class form-select (instead of form-input) to trigger the custom styles to the <select> element.

For example,

<select class="form-select mb-3">
 <option selected>- Select -</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 by adding classes like .form-select-lg and .form-select-sm.

2. Disabled

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