Range：HTML5中的新型Input类型

        在HTML5之前，为了创造出类似滑块控件的效果，Web程序员一般是使用JavaScript或Flash来做为解决方案。HTML5的到来省去了Web程序员成百上千行代码。新出现的input输入框类型range，(<input type=”range”>)，它的基本模样就是滑块控件。而其代码非常的简单：

       以前是IE独自统天下时，页面上各种组件的样式只有一种，而当谷歌浏览器、火狐浏览器、Safari浏览器要和IE平分天下时，你就会发现页面上的基本组件中各种浏览器中也表现出各自的特点。range类型的输入框在各种浏览器里的外观也是稍微有些不同，但功能是完全一样的：

      大家看到了，range类型的视觉效果和其他input类型完全不同。


      下面让我们看一下实际演示：


      你对HTML5的了解有多少？(程度是1到10)：


     input Range类型还有一些非常有趣的其它属性，你会经常的用到它们。

属性描述

value

跟其它input类型里的value属性一样。可以是整数，也可以是浮点数。缺省值是最小值和最大值的中间值。

min

范围的最小值。缺省值是0。

max

范围的最大值。缺省值是100。

step

步长，滑块组件滑动时value变动的最小单位。缺省值是1。如果最小值min是浮点数，step也可以是浮点数。

list

List就是DataList，但目前为止还没有浏览器实现这个功能。

参照实例演示，你会很容易理解这些属性的作用。


演示 1. 指定最大值、最小值、步长。