zoukankan      html  css  js  c++  java
  • H5新特性

    1,H5新增新特性有哪些:

    html5新增标签

    mark 标记

    meter 表示度量

    progress 进度条

    ruby 注释

    rt 对ruby元素内容的解释

    rp 当浏览器不支持ruby元素的时候显示的内容

    time 表示一个时间点

    datalist:配合input使用,并且通过input的list属性和datalist的id属性进行绑定

    datalist相对于select多了一个自动查询的功能

    h5新增的表单元素

    新增的类型

      email:可以自动验证输入的字符串是否是一个合法的邮箱地址

      url:自动验证文本框内容是否是一个合法的URL地址

      number:可以指定最大最小值以及数字改变的幅度,并且可以校验输入的数字是否在指定范围内,文本框只能输入数字

      range:表示一个范围

      Date Picker:

        date:选取日、月、年

        month:选取月、年

        week:选取周和年

        time:选取时间(小时和分钟)

        datetime:选取时间、日、月、年(本地时间)

      search:搜索

      在移动端可以调取键盘的搜索按钮

    output用法

    <form oninput="x.value = parseInt(a.value) + parseInt(b.value)">
        0 <input type="range" id="a" value="50"> 100
        + <input type="number" id="b" value="50">
        = <output name="x" for="a b"></output>
    </form>

    <canvas></canvas>标签

    canvas的详细用法还需配合JavaScript使用

    audio:音频

      src:音频的资源位置

      controls:控制条

      autoplay:自动播放

      loop:循环播放

      preload:预加载

    video:视频

    视频和音频支持的格式

    用于视频:

      video / ogg

      video / mp4

      video / webm

    用于音频:

      audio / ogg

      audio / mpeg

    source:导入视频或者音频资源

    h5新增的语义标签

    header 定义section或page的页眉

    footer 定义section或page的页脚

    section 定义section

    article 定义文章

    aside 定义页面内容之外的内容  侧边栏

    都跟div的用法一模一样

    唯一的区别就是这些标签具备语义

    summary 为details元素定义可见的标题

    details 定义元素的细节

    示例:

    <details>
        <summary>点击展开</summary>
        文本详细内容···
    </details>
  • 相关阅读:
    洛谷
    洛谷
    NOIP 普及组 2014 螺旋矩阵
    NOIP 普及组 2014 珠心算测验
    hdu 1114Piggy-Bank(完全背包)
    hdu 2059龟兔赛跑("01"背包)
    洛谷 P1282 多米诺骨牌("01"背包)
    洛谷 P1140 相似基因(DP)
    洛谷 P1880 [NOI1995] 石子合并(区间DP)
    洛谷 P1280 尼克的任务
  • 原文地址:https://www.cnblogs.com/UnfetteredMan/p/14042680.html
Copyright © 2011-2022 走看看