zoukankan      html  css  js  c++  java
  • html5基础

    html5基础

    Html基础

    1、什么是HTML5

      HTML5是新一代HTML标准。

    2、HTML,HTML4.01的上一个版本诞生于1999年。自从那以后,Web世界已经经历了巨变。

    3、HTML5是HTML最新的修订版本,2014年10月由万维网联盟(W3C)完成标准制定。

    4、HTML5的设计目的是为了在移动设备上支持多媒体。

    5、HTML5简单易学。

    (2)、HTML5的改进

    1、新元素2、新属性3、完全支持CSS34、Video和Audio5、2D/3D制6、本地存储7、Web应用

    (3)、HTML5的优点

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

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

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

    4、可以很好的替代FLASH和Silverlight。

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

    6、可移植性好。

     

    HTML5中新增的元素

    (1)、<canvas>新元素

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

    (2)、新多媒体元素

    <audio>定义音频内容

    <video>定义视频(video或者movie)

    <source>定义多媒体资源<video>和<audio>

    (3)、新表单元素

    <datalist>定义选项列表。请与input元素配合使用该元素,来定义input可能的值。

    <output>定义不同类型的输出,比如脚本的输出。

    (4)、新的语义和结构元素

    HTML5提供了新的元素来创建更好的页面结构:

    <article>定义页面独立的内容区域。

    <aside>定义页面的侧边栏内容。

    <command>定义命令按钮,比如单选按钮、复选框或按钮

    <details>用于描述文档或文档某个部分的细节

    <dialog>定义对话框,比如提示框

    <summary>标签包含details元素的标题

    <footer>定义section或document的页脚。

    <header>定义了文档的头部区域

    <nav>定义导航链接的部分。

    <progress>定义任何类型的任务的进度。

    <section>定义文档中的节(section、区段)。

     

     

    .HTML5中移出的标签

    美元符号定义jQuery

    以下的HTML4.01元素在HTML5中已经被删除:

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

     

    <datalist>元素

    <datalist>元素规定输入域的选项列表,<datalist>属性规定form或input域

    应该拥有自动完成功能。当用户在自动完成域中开始输入时,浏览器应该在该域中

    显示填写的选项:使用<input>元素的列表属性与<datalist>元素绑定。

    <input list="browsers">

      <datalist id="browsers">

        <option value="InternetExplorer">

        <option value="Firefox">

        <option value="Chrome">

        <option value="Opera">

        <option value="Safari">

      </datalist>

     

    Output 输出结果 name 你要操作的表单元素的变量,for:定义一个或多个元素的输出域的元素。

    新的表单属性

    (1)、placeholder占位符

    (2)、autofocus获取焦点

    autofocus属性是一个boolean属性.

    autofocus属性规定在页面加载时,域自动地获得焦点。

    (3)、autocomplete自动完成,用于表单元素,也可用于表单自身

    autocomplete属性规定form或input域应该拥有自动完成功能。

    当用户在自动完成域中开始输入时,浏览器应该在该域中显示填写的选项。

    提示:autocomplete属性有可能在form元素中是开启的,而在input元素中是关闭的。

    注意:autocomplete适用于<form>标签,以及以下类型的<input>标签:text,search,url,

    telephone,email,password,datepickers,range以及color。

    (4)、name指定表单项属于哪个form,处理复杂表单时会需要

    (5)、novalidate关闭验证,可用于<form>标签

    novalidate属性是一个boolean(布尔)属性.

    novalidate属性规定在提交表单时不应该验证form或input域。

    (6)、required验证条件,(必填项)

    required属性是一个boolean属性.

    required属性规定必须在提交之前填写输入域(不能为空)。

    注意:required属性适用于以下类型的<input>标签:text,search,url,telephone,email,password,

    datepickers,number,checkbox,radio以及file。

    (7)、pattern正则表达式验证表单

    pattern属性描述了一个正则表达式用于验证<input>元素的值。

    注意:pattern属性适用于以下类型的<input>标签:text,search,url,tel,email,和password.

    提示:是用来全局title属性描述了模式.

    提示:您可以在我们的JavaScript教程中学习到有关正则表达式的内容

    (8)、maxlength最大长度minlength最小长度   一般用于text文本属性

    Onkeydown 与 onkeypress区别

    Keydown按键的范围大

     .表单新增的事件

    oninput用户输入内容时触发,可用于移动端输入字数统计

    document.getElementById("name").oninput=function(){

    console.log(this.value);

    }

    document.getElementById("name").onkeyup=function(){

    console.log("---"+this.value);

    }

     

    Paused 暂停 video mp4

    多媒体

    (1)、Audio(音频)

    controls如果出现该属性,则向用户显示音频控件(比如播放/暂停按钮)。

    loop如果出现该属性,则每当音频结束时重新开始播放。

    muted如果出现该属性,则音频输出为静音。

    Paused 暂停

    (2)、Video(视频)

    controls如果出现该属性,则向用户显示控件,比如播放按钮。

    height设置视频播放器的高度。

    loop如果出现该属性,则当媒介文件完成播放后再次开始播

    放。
    muted如果出现该属性,视频的音频输出为静音。
    width设置视频播放器的宽度。

    Paused 暂停

  • 相关阅读:
    一个疑难杂症 IIS URL区分大小写(FF的自动变换URL问题)?
    炉石传说 C# 设计文档(序)
    炉石传说 C# 开发笔记(BS上线尝试)
    炉石传说 C# 开发笔记(BS模式Demo)
    炉石传说 C# 开发笔记(6月底小结)
    炉石传说 C# 开发笔记 (初版)
    使用python+requests实现接口自动化测试
    SpringMVC之数据传递二
    SpringMVC之数据传递一
    SpringMVC之HandlerMapping的使用
  • 原文地址:https://www.cnblogs.com/wenaq/p/13520550.html
Copyright © 2011-2022 走看看