• HTML5---3.表单新增的type属性


    新增的表单类型

         形如:    <input  type=”xxx”  >
        url  number   email  tel    search    color  date  datetime  week   month   range  
    
    <body>
    <form action="">
        用户名:<input type="text" name="userName"> <br>
        密码:<input type="password" name="userPwd"> <br>
        <!--email提供了默认的电子邮箱的完整验证:要求必须包含@符号,同时必须包含服务器名称,如果不能满足验证,则会阻止当前的数据提交-->
        邮箱:<input type="email"> <br>
        <!--tel它并不是来实现验证。它的本质目的是为了能够在移动端打开数字键盘。意味着数字键盘限制了用户只能输入数字。  如何查看效果:qq发送文件>>手机端使用qq来接收>>使用手机浏览器查看-->
        电话:<input type="tel"> <br>
        <!--验证只能输入合法的网址:必须包含http://-->
        网址:<input type="url"> <br>
        <!--number:只能输入数字(包含小数点),不能输入其它的字符
        max:最大值
        min:最小值
        value:默认值-->
        数量:<input type="number" value="60" max="100" min="0"> <br>
        <!--search:可以提供更人性化的输入体验-->
        请输入商品名称:<input type="search"> <br>
        <!--range:范围-->
        范围:<input type="range" max="100" min="0" value="50"> <br>
        颜色:<input type="color"> <br>
        <!--日期时间相关-->
        <!--time:时间:时分秒-->
        时间:<input type="time"> <br>
        <!--date:日期:年月日-->
        日期:<input type="date"> <br>
        <!--datetime:大多数浏览器不能支持datetime.用于屏幕阅读器-->
        日期时间:<input type="datetime"><br>
        <!--datetime-local:日期和时间-->
        日期时间:<input type="datetime-local"> <br>
        月份:<input type="month"> <br>
        星期:<input type="week">
        <!--提交-->
        <input type="submit">
    </form>
    </body>
    

    浏览器效果如下:

    <body> <form action=""> 用户名:<input type="text" name="userName"> <br> 密码:<input type="password" name="userPwd"> <br> <!--email提供了默认的电子邮箱的完整验证:要求必须包含@符号,同时必须包含服务器名称,如果不能满足验证,则会阻止当前的数据提交--> 邮箱:<input type="email"> <br> <!--tel它并不是来实现验证。它的本质目的是为了能够在移动端打开数字键盘。意味着数字键盘限制了用户只能输入数字。 如何查看效果:qq发送文件>>手机端使用qq来接收>>使用手机浏览器查看--> 电话:<input type="tel"> <br> <!--验证只能输入合法的网址:必须包含http://--> 网址:<input type="url"> <br> <!--number:只能输入数字(包含小数点),不能输入其它的字符 max:最大值 min:最小值 value:默认值--> 数量:<input type="number" value="60" max="100" min="0"> <br> <!--search:可以提供更人性化的输入体验--> 请输入商品名称:<input type="search"> <br> <!--range:范围--> 范围:<input type="range" max="100" min="0" value="50"> <br> 颜色:<input type="color"> <br> <!--日期时间相关--> <!--time:时间:时分秒--> 时间:<input type="time"> <br> <!--date:日期:年月日--> 日期:<input type="date"> <br> <!--datetime:大多数浏览器不能支持datetime.用于屏幕阅读器--> 日期时间:<input type="datetime"><br> <!--datetime-local:日期和时间--> 日期时间:<input type="datetime-local"> <br> 月份:<input type="month"> <br> 星期:<input type="week"> <!--提交--> <input type="submit"> </form> </body>
  • 相关阅读:
    第9章 线程编程(7)_线程同步4:信号量
    第9章 线程编程(6)_线程同步3:条件变量
    第9章 线程编程(5)_线程同步2:读写锁
    第9章 线程编程(4)_线程同步1:互斥锁
    第9章 线程编程(3)_线程清理和控制函数
    第9章 线程编程(2)_线程创建和终止
    第9章 线程编程(1)_线程概念和线程标识
    第8章 信号(6)_贯穿案例2:mini shell(3)
    第8章 信号(5)_信号集和信号屏蔽
    第8章 信号(4)_中断的系统调用和函数可重入性
  • 原文地址:https://www.cnblogs.com/Tobenew/p/10506767.html
Copyright © 2020-2023  润新知