Range：HTML5中的新型Input类型

之前曾经简单的介绍过HTML5中的几个新出现的input类型：number(数字)，date(日期)，color(颜色)，range(范围)等等，这里详细说一下Range类型。Range就是范围：年龄范围，工资范围，人数范围。当页面上需要用户输入一个在一定范围内的数字时，使用一个类似滑块控件是十分方便的。一个典型的滑块控件使用场景就是颜色选择器中用左右拖拽箭头来调节RGB颜色值。

不要奇怪滑块组件旁边的显示数字的文本框，它并不是Range输入框的组成部分，是我为了更好的演示效果而放置的。
演示 2. 设置缺省值。

<input id="slider2" type ="range" min ="100" max="500" step ="50" value ="100"/> 

Minimum = -300, Maximum = 300, Step = 50, Value = 100

演示 3. 下面我们来试一下用浮点数。

<input id="slider3" type ="range" min ="-2.5" max="3.0" step ="0.1"/> 

Minimum = -2.5, Maximum = 3.0, Step = 0.1

以上就是Range：HTML5中的新型Input类型的内容，更多相关内容请关注PHP中文网（HdhCmsTestgxlcms测试数据）！

查看更多关于Range：HTML5中的新型Input类型的详细内容...