YouTip` as the parent element with the classes `.custom-control` and `.custom-checkbox`. The checkbox is placed inside this `
` as a child element, with the checkbox set to **type="checkbox"** and the class `.custom-control-input`.
The text for the checkbox uses a **label** tag with the class `.custom-control-label`. The **for** attribute of the **label** must match the **id** of the checkbox.
## Bootstrap4 Example
[Try it »](#)
* * *
## Custom Radio Buttons
To customize a radio button, you can set a `
` as the parent element with the classes `.custom-control` and `.custom-radio`. The radio button is placed inside this `
` as a child element, with the radio button set to **type="radio"** and the class `.custom-control-input`.
The text for the radio button uses a **label** tag with the class `.custom-control-label`. The **for** attribute of the **label** must match the **id** of the radio button.
## Bootstrap4 Example
[Try it »](#)
* * *
## Custom Controls Inline
We can wrap custom form controls with an outer element using the `.custom-control-inline` class, so that the custom form controls appear on the same line:
## Bootstrap4 Example
[Try it »](#)
* * *
## Custom Select Menu
To create a custom select menu, add the `.custom-select` class to the `` element:
## Bootstrap4 Example
Custom Select MenuGoogleTutorialTaobao
[Try it »](#)
If we want to set the size of the custom select menu, we can use `.custom-select-sm` and `.custom-select-lg` to set their sizes:
## Bootstrap4 Example
Smaller Custom Select MenuGoogleTutorialTaobaoLarger Custom Select MenuGoogleTutorialTaobao
[Try it »](#)
* * *
## Custom Range Slider
We can add the `.custom-range` class to an **input** of **type="range"** to create a custom range slider:
## Bootstrap4 Example
[Try it »](#)
* * *
## Custom File Upload
We can add the `.custom-file` class to the parent element, then set the **input** to **type="file"** and add the `.custom-file-input` class:
The text for the upload control uses a **label** tag with the class `.custom-file-label`. The **for** attribute of the **label** must match the **id** of the upload control.
## Bootstrap4 Example
[Try it »](#)