mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-05-30 15:24:08 +03:00
Custom select updates (#24699)
* Add support for size attribute on custom selects * Add large custom select, document it and the small variant * fix custom select focus state * fix custom file input focus styles * remove empty line
This commit is contained in:
@@ -1018,6 +1018,46 @@ Custom `<select>` menus need only a custom class, `.custom-select` to trigger th
|
||||
</select>
|
||||
{% endexample %}
|
||||
|
||||
You may also choose from small and large custom selects to match our similarly sized text inputs.
|
||||
|
||||
{% example html %}
|
||||
<select class="custom-select custom-select-lg">
|
||||
<option selected>Open this select menu</option>
|
||||
<option value="1">One</option>
|
||||
<option value="2">Two</option>
|
||||
<option value="3">Three</option>
|
||||
</select>
|
||||
|
||||
<select class="custom-select custom-select-sm">
|
||||
<option selected>Open this select menu</option>
|
||||
<option value="1">One</option>
|
||||
<option value="2">Two</option>
|
||||
<option value="3">Three</option>
|
||||
</select>
|
||||
{% endexample %}
|
||||
|
||||
The `multiple` attribute is also supported:
|
||||
|
||||
{% example html %}
|
||||
<select class="custom-select" multiple>
|
||||
<option selected>Open this select menu</option>
|
||||
<option value="1">One</option>
|
||||
<option value="2">Two</option>
|
||||
<option value="3">Three</option>
|
||||
</select>
|
||||
{% endexample %}
|
||||
|
||||
As is the `size` attribute:
|
||||
|
||||
{% example html %}
|
||||
<select class="custom-select" size="3">
|
||||
<option selected>Open this select menu</option>
|
||||
<option value="1">One</option>
|
||||
<option value="2">Two</option>
|
||||
<option value="3">Three</option>
|
||||
</select>
|
||||
{% endexample %}
|
||||
|
||||
### File browser
|
||||
|
||||
The file input is the most gnarly of the bunch and require additional JavaScript if you'd like to hook them up with functional *Choose file...* and selected file name text.
|
||||
|
||||
Reference in New Issue
Block a user