zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    AlphaGo的前世今生(三)AlphaGo Zero: AI Revolution and Beyond
    AlphaGo的前世今生(二)AlphaGo: Countdown to AI Revolution
    AlphaGo的前世今生(一)Deep Q Network and Game Search Tree:Road to AI Revolution
    Exception starting filter [Tongweb WebSocket (JSR356) Filter
    spring boot 集成 redis 出现 “Unable to connect to localhost:6379”
    对女性友好的编程语言
    Git(1)
    js里面看一个字符串的汉字的个数
    celery使用的一些小坑和技巧(非从无到有的过程)
    永远相信美好的事情即将发生。
  • 原文地址:https://www.cnblogs.com/crazier/p/12470315.html
Copyright © 2011-2022 走看看