zoukankan      html  css  js  c++  java
  • html5 note

    HTML5的特点

    • 绘图支持 canvas

    • 多媒体支持 video audio

    • 离线应用 和 离线存储

    • 新的语义化元素 article footer header nav section

    • 表单增强 calendar date time email url search

    浏览器对HTML5的支持

    对于无法识别的标签 新旧浏览器都作为内联标签处理

    HTML5定义了8个新的语义元素: header nav footer aside section article main figure, 并且这些元素都是display:block的块元素

    现代浏览器可以直接添加新元素到html中如(<div><hello>nice to see you again</hello></div>),然后为它定义样式 hello{display:block; color:green; font-size:20px;} IE需要用js创建新元素 hello = document.createElement('hello');

    html5shiv.js让IE6/7/8支持html5元素

    <!--[if lt IE 9]>
      <script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
    <![endif]-->
    

    针对IE浏览器html5shiv 是比较好的解决方案。html5shiv主要解决HTML5提出的新的元素不被IE6-8识别,这些新元素不能作为父节点包裹子元素,并且不能应用CSS样式。

    html5shiv.js 引用代码必须放在 <head> 元素中,因为 IE 浏览器在解析 HTML5 新元素时需要先加载该文件。

    HTML5的新元素

    绘图

    • canvas

        <canvas id="mycanvas" width="300" height="200">你的浏览器不支持canvas</canvas>
        
        var canvas = document.getElementById('mycanvas');
        ctx = canvas.getContext('2d');
        ctx.fillStyle = '#FFEEAA';
        ctx.fillRect(0, 0, 80, 100);
      

      <canvas> 标签只是图形容器,您必须使用脚本来绘制图形
      <canvas> 元素中的任何文本将会被显示在不支持 <canvas> 的浏览器中。

    新多媒体

    audio
    video
    source
    embed
    track

  • 相关阅读:
    Zara带你快速入门WPF(1)---开篇
    Vue Route Building the UI back-end framework
    TDX指标的理解与改造(价格到达指标线提醒)
    Vue生命周期详解
    Vue轻松入门,一起学起来!
    NodeJs安装步骤与淘宝镜像
    使用npm安装配置vue
    JavaScript面向对象
    vim常用快捷键
    python常用命令
  • 原文地址:https://www.cnblogs.com/stephenykk/p/5139669.html
Copyright © 2011-2022 走看看