Which Input Type Defines a Slider Control
In this article, we will know which input type defines a slider control in HTML. Before HTML 5 came, we achieved using a minimum and maximum text field. For ex, we can filter by set maximum and minimum range of prices on an E-commerce website. But the slider control is used to get an integer value from the user. Let’s see how to create a slider control with an example:
HTML:
<html>
<head>
<title>Demo</title>
</head>
<body>
<input type="range" name="price" min="0" max="100" step="5">
</body>
</html>
Output:
Steps:
- In the above code, we have created a slider control. To create slider control, we need to use the “input” tag and set the “type” attribute to “range”.
- To set minimum and maximum values, we need to use the “min” and “max” attributes. Here, we set ‘min’ to 0 and ‘max’ to 100, so the range value will accept from 0 to 100.
- And we have set the “step” attribute to 5, which means it when we increase the range it will increase by 5.
- See the above output, our expected output is displayed successfully.