• html5新特性总结


    1.canvas绘图

    • 矩形和线条的绘制fillStyle,strokeStyle,路径beginPath,moveTo,lineTo,fill,stroke,closePath
    • 插入图片drawImage
    • 像素操作ImageData
    • 文字写入font,fillText,strokeText
    • 颜色渐变CanvasGradient对象createLinearGradient,createRadialGradient

    2.Form type= 

    • number:限制输入的数字 max min step
    • url:验证url格式
    • email:验证email格式
    • telephone:电话
    • color:获取颜色
    • range:创建滑块min max step
    • Date Pickers date(日月年) month(月年) week(周年) time(hour&minute)datetime(时间日月年) datetimelocal
    • list  datalist(下拉列表)

    3. 视频与音频

    • video
      •   支持Ogg,Mpeg4,webM
      •   autoplay controls preload
    • audio
      •   Ogg Vorbis,MP3,Wav
      •   autoplay,controls

    4. web 存储

    • localstorage
    • sessionstorage

    5.其他:

    1. 新的文档类型

    <!DOCTYPE html>

    2. link 与script不需要类型了

    <link rel="stylesheet" href="a/b/c.css" />
    <script src="a.js" />

    3. 语义化标签header、footer、Hgroup、nav、article、section、aside……

    4.有用的标签:

    • 高亮文本的标签<mark>
    • 小字体排版的标签<small>用于footer中的版权信息
    • figure与figcaption,将图像与文字描述联系起来

    5.有用的属性

    • placeholder:占位符
    • required:必要属性
    • autofocus:自动聚焦
    • contenteditable:内容可编辑
    • 正则表达式:pattern
    • input:type为email,在客户端验证邮箱;range:创建滑块,有min,max,step属性,可以通过after/before显示属性

    6. local storage:客户端存储,永久存储大的数据段,知道主动删掉

    7. audio:有controls进度条属性

    8. video:有preload预加载、controls进度条属性

     placeholder

    <input type="text" name="desplaceholder" placeholder="bxwlysy" />

     required必要属性

    <input type="text" name="desrequire" required />

     audio 

    <audio autoplay="autoplay" controls="controls">
    <source src="file.ogg" />
    <source src="file.mp3"/>
    </audio>

    firefox支持.ogg webkit支持.mp3 ie不支持,opera10及以下支持.wav

    video preload controls

  • 相关阅读:
    6000?
    基本把“主页大巴”做完了
    myDesk
    挂出了
    如何在网页中添加flash文件
    oracle的SQl语句
    打开PHP 提示下载
    实时计字数提醒的文本框
    wampserver无法打开http://localhost
    “ASP.adduser_aspx.GetTypeHashCode()”: 没有找到适合的方法来重写
  • 原文地址:https://www.cnblogs.com/danranysy/p/4734534.html
Copyright © 2020-2023  润新知