首页 > 代码库 > H5表单元素

H5表单元素

一、input类型

       1、电子邮件类型

               (1)功能描述:输入E-mail地址的文本框

               (2)语法:<input type="email" /> 

       2、搜索类型

               (1)功能描述:输入搜索关键字操作的文本框

               (2)语法:<input type="search" />

       3、URL类型

           (1)功能描述:输入Web站点的文本框

               (2)语法:<input type="url" />

       4、电话号码类型

            (1)功能描述:主要针对电话号码的输入能够指示浏览器根据不同的设备进行调整

                (2)语法:<input type="tel" />

       5、数字类型

                (1)功能描述:只能接收数字值

                (2)语法:<input type="number" />

                (3)属性:
                    --min:当前域能接受的最小值

                    --max:当前域能接受的最大值

                    --step:决定了域所接受值的递增或递减的步长,默认为1

       6、范围类型

                (1)功能描述:允许用户选择一个范围的数值

                (2)语法:<input type="range" min="10" max="1000" value="http://www.mamicode.com/50" />

                (3)属性:

                    --min:范围的下限值

                    --max:范围的上限值

                    --step:声明该值递增或递减的步长

                    --value:设定初始值

       7、颜色类型 

               (1)功能描述:预定义的颜色拾取控件

               (2)语法:<input type="color" />

       8、日期类型               (1)功能描述:创建一个日期输入域

               (2)语法:<input type="date" />

       9、周类型

               (1)功能描述:与date类型相似,但是只能选择周

               (2)语法:<input type="week" />

       10、月类型

                 (1功能描述:与date类型很相似,但是只能选择一个月份

                 (2)语法:<input type="month" />

 

二、新表单元素

     1、<datalist>元素

             --是一个表单特有的元素,它可以使用list属性预创建一组列表项,后面可以为输入框的输入提示

     2、<progress>元素

             --表示一个任务的完成进度,而且通常这些任务都在表单中启动和处理

             --属性:

                      value:任务执行的进度

                      max:声明任务完成后达到的值

     3、<meter>元素

             --与<progress>元素类似,可用于显示刻度,而非进度

             --属性:

                      min和max:设置范围的边界

                      value:确定测量的值

                      low、high和opimum讲范围划分为不同的部分和设置最佳位置

     4、<output>元素

             --通常用于显示表单元素处理的结果值

             --属性:

                      for:讲output元素与参与计算的源元素相关联,目的为了提高代码可读性

           

 

H5表单元素