HTML5(一)

一、处理浏览器兼容问题

  html5shiv.min.js  处理ie9以下的对于H5标签的兼容性问题  respond.js 处理css3的兼容性问题

加判断,如果是IE9以下的浏览器,就执行这个代码

<!-- 条件注释 -->
    <!--[if lt IE9]>
    <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.js"></script>
    <![endif]-->

二、什么是HTML5

1、HTML5 是下一代 HTML 标准

   HTML5HTML最新的修订版本,201410月由万维网联盟(W3C)完成标准制定。

2、HTML5的优点

  (1)、提高可用性和改进用户的友好体验。

  (2)、有几个新的标签,这将有助于开发人员定义重要的内容。

  (3)、可以给站点带来更多的多媒体元素(视频和音频)

  (4)、可以很好的替代FLASHSilverlight

  (5)、将被大量应用于移动应用程序和游戏。

  (6)、可移植性好

三、HTML新增元素

1、 <canvans>

  标签定义图形,比如图表和其他图像。该标签基于JavaScript的绘图 API

2、<audio> 定义音频内容

controls  出现控制栏
muted   静音
loop  循环播放
autoplay  自动播放(谷歌不支持自动播放)
3、<video>   定义视频(video或者movie)
controls  出现控制栏
muted   静音
loop  循环播放 
autoplay  自动播放

4、<source> 定义多媒体资源video或者audio

<video id="video1">
        <source src='./video/captian.mp4'>
        <source>
        <source src='./video/captian.Ogg'>
        <source>
        <source src='./video/captian.webm'>
        <source>
    </video>
5、<detailst> 定义选项列表,与input元素配合使用    
//类似于下拉菜单,可以进行选择
<datalist id="datalist1">
         <option value="aa">苹果</option>
        <option value="bb">香蕉</option>
        <option value="cc">橘子</option>
</datalist>
6、<output> 定义不同类型的输出
可以进行两数相加
<form  oninput = 'x.value = parseInt(inp1.value)+parseInt
    (inp2.value)'>
        <input type="number" id="inp1" value="1"> +
        <input type="number" id="inp2" value="1"> = 
        <output name = 'x' for = 'inp1 inp2'>0</output>
    </form>
7、<article>    定义页面独立的内容区域。
<aside>    定义页面的侧边栏内容。
<command>   定义命令按钮,比如单选按钮、复选框或按钮
<details>    用于描述文档或文档某个部分的细节
<dialog>   定义对话框,比如提示框
<summary>  标签包含 details 元素的标题

 

<footer>  定义了section或document的页脚
<header>  定义文档头部区域
<nav>  定义导航链接部分
<progress>   定义任何类型的任务进度
<section>  定义文档中的节(section,区段)

四、HTML5中移除的标签

美元符号定义 jQuery

以下的 HTML 4.01 元素在HTML5中已经被删除:

<acronym><applet><basefont><big><center><dir><font><frame><frameset><noframes><strike><tt>

 

 

 

posted on 2020-08-17 21:31  cx125  阅读(93)  评论(0编辑  收藏  举报

导航