首页
到顶部
到尾部
网页设计培训

input标记时间类型属性应用实例介绍

时间:2012-9-1 14:53:32  作者:学计算机网  来源:  查看:208  评论:0
内容摘要:input标记时间类型属性在网页设计中有着重要的应用,是一个非常实用的属性,下面通过几个实例为大家介绍一下:1、Date类型:<form>       <i...

input标记时间类型属性在网页设计中有着重要的应用,是一个非常实用的属性,下面通过几个实例为大家介绍一下:


1、Date类型:

<form>
 
      <input id="poluoluo_date" name="poluoluo.com" type="date"/>
 
      <input type="submit" value="提交"/>
 
</form>

如果在之前,我们使用js+css+dom才能实现日历选择日期的效果,在HTML5中,我们只需要设置input为date类型即可,提交表单的时候也不需要我们验证数据了,它已经帮我们实现了。



2、Time类型:

<form>
 
      <input id="poluoluo_time" name="poluoluo.com" type="time"/>
 
      <input type="submit" value="提交"/>
 
</form>

此类型是一个专门用来输入时间的文本框,在提交的时候检查是否输入了有效的时间。



3、DateTime类型:

<form>
 
      <input id="poluoluo_datetime" name="poluoluo.com" type="datetime"/>
 
      <input type="submit" value="提交"/>
 
</form>

datetime类型的input元素是专门用来输入UTC日期和实践的文本框,在提交的时候,对日期和时间进行有效的检查。

 

4、DateTime-Local类型:

<form>
      <input id="poluoluo_datetime-local" name="poluoluo.com" type="datetime-local"/>
      <input type="submit" value="提交"/>
</form>

此类型与datatime类型差不多,只不过是用来输入本地的日期和时间。

 

5、Month类型:

<form>
 
      <input id="poluoluo_month" name="poluoluo.com" type="month"/>
 
      <input type="submit" value="提交"/>
 
</form>

month是一种专门输入月份的文本框,在日历中,你只能选择某一个月,不能选择某一天。

 

6、Week类型:

<form>
 
      <input id="poluoluo_week" name="poluoluo.com" type="week"/>
 
      <input type="submit" value="提交"/>
 
</form>

week是专门用来输入周(星期)的文本框,W后面所跟的数字表示此周是当年的第几个星期。在日历中只能选择一周,同样不能选择某一天。





相关课程
    网上报名

    长春学计算机「长春IT培训」开设课程包括:室内装潢设计、景观园林设计、平面设计广告设计、网页设计、办公软件、影视后期设计等
    ©2012-2017优学府IT精英培训版权所有