HTML5学习

  1. html4.0,xhtml,html5.0的区别:

    1. 出现的先后顺序,html4.0是最先出来的版本,但是其很不严谨,对标签的大小写和是否关闭都没有做出相应的约束,后面就出现了xhtml,这最初w3c并没有意识到这些问题,随后就有很多的浏览器厂商开始联合起来去建立了规范,就是xhtml的早期版本,后来为W3C意识到了这样的问题,并认为这是互联网的基础性问题,所以xhtml规范开始流行出来,html5是再前两种的基础上添加了一些标签和属性,结合了css3和javascript。但是目前为止大部分新增标签大部分的浏览器都已经支持,但是IE9一下的浏览器并不支持。
    2. 最严谨的就是xhtml.
  2. html5新增标签:
      1. canvas:canvas> 标签定义图形,比如图表和其他图像。
      2. datalist:标签定义选项列表。请与 input 元素配合使用该元素,来定义 input 可能的值。datalist 及其选项不会被显示出来,它仅仅是合法的输入值列表 1.* *
      3. figcaption:标签定义 figure 元素的标题(caption)。

        黄浦江上的的卢浦大桥

      4. mark: 标签定义带有记号的文本。请在需要突出显示文本时使用 标签。

    1. 常用标签:
      1. header:标签定义文档的页眉
      2. footer:标签定义 section 或 document 的页脚
      3. aside:标签定义其所处内容之外的内容
      4. article: 标签定义独立的内容
      5. section:主要是一篇文章中的一个段落中使用
      6. nav: 标签定义导航链接的部分。Home Previous Next
  3. html5表单:
    1. 表单属性

      1. email
      2. url
      3. number
      4. range
      5. Date pickers
      6. search
    2. 表单元素:
      1. datalist 元素:datalist 元素规定输入域的选项列表。列表是通过 datalist 内的 option 元素创建的。
      2. keygen 元素:作用是提供一种验证用户的可靠方法。keygen 元素是密钥对生成器(key-pair generator)。当提交表单时,会生成两个键,一个是私钥,一个公钥。私钥(private key)存储于客户端,公钥(public key)则被发送到服务器。公钥可用于之后验证用户的客户端证书(client certificate)。

    Username:  Encryption:

  4. html5视频:
    1. video:

      1. autoplay:如果出现该属性,则视频在就绪后马上播放。
      2. controls:如果出现该属性,则向用户显示控件,比如播放按钮。
      3. height:设置视频播放器的高度。
      4. loop:如果出现该属性,则当媒介文件完成播放后再次开始播放。
      5. preload: 如果出现该属性,则视频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性。
      6. src:要播放的视频的 URL。
      7. width:设置视频播放器的宽度。
  5. html5音频:
    1. audio 您的浏览器不支持 audio 标签。

      1. autoplay:如果出现该属性,则音频在就绪后马上播放。
      2. controls:如果出现该属性,则向用户显示控件,比如播放按钮。
      3. loop:如果出现该属性,则每当音频结束时重新开始播放。
      4. preload: 如果出现该属性,则音频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性。
      5. src:要播放的音频的 URL。
时间: 2024-09-30 06:30:44

HTML5学习的相关文章

HTML5 学习

1.details元素 details元素标识用户要求得到并且可以得到的细节信息,用于描述文档或文档某个部分的细节.它可以与summary元素配合使用.summary元素提供标题或图例.标题是可见的,用户点击标题时,会显示出细节信息,也就是details里面定义的信息. <details> <summary>HTML 5</summary> This document teaches you how to learn about HTML 5 </details&

html5学习笔记(3)--主题结构元素-1

html5学习笔记(3)--主题结构元素-1 Article元素 以下为对应代码: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <article> <header> <h1>极客学院</h

html5学习(一)--canvas画时钟

利用空余时间学习一下html5. 1 <!doctype html> 2 <html> 3 <head></head> 4 <body> 5 <canvas id="clock" width="500" height="500"></canvas> 6 <script> 7 var clock=document.getElementById('cloc

HTML5学习笔记(二)——表单1

表单一直是网页必不可少的一部分,一直以来,表单的作用被无限扩展,发展出了诸多新奇的用法,老版的HTML只支持很少的一部分常用表单,许多的新表单都需要借助CSS与JavaScript语言来进行构建,现在HTML5来了,她带来了新的表单,这些强大的表单项,可以省去一大块复杂的JavaScript代码,很值得去学习. 而且在新的表单里面,不再像以前每个表单都必须位于<form></form>之内,只要在<form></form>内定义一个id,然后在网页任何位置都

HTML5 学习笔记(一)——HTML5概要与新增标签

一.HTML5概要 1.1.为什么需要HTML5 HTML4陈旧不能满足日益发展的互联网需要,特别是移动互联网.为了增强浏览器功能Flash被广泛使用,但安全与稳定堪忧,不适合在移动端使用(耗电.触摸.不开放). HTML5增强了浏览器的原生功能,符合HTML5规范的浏览器功能将更加强大,减少了Web应用对插件的依赖,让用户体验更好,让开发更加方便,另外W3C从推出HTML4.0到5.0之间共经历了17年,HTML的变化很小,这并不符合一个好产品的演进规则. 1.2.什么是HTML5 HTML5

HTML5 学习总结(一)——HTML5概要与新增标签

目录 一.HTML5概要 1.1.为什么需要HTML5 1.2.什么是HTML5 1.3.HTML5现状及浏览器支持 1.4.HTML5特性 1.5.HTML5优点与缺点 1.5.1.优点 1.5.2.缺点 1.6.HTML5效果展示 1.7.HTML5学习与开发工具 1.7.1.基础要求 1.7.2.开发工具 1.8.HTML5语法规则与文档声明 1.8.1.语法规则 1.8.2.文档声明 1.8.2.文档声明 二.废弃的标签 三.新增的标签 3.1.新增的结构标签 3.2.新增加其它元素 3

[html5] 学习笔记-表单新增的元素与属性(续)

本节主要讲解表单新增元素的controls属性.placeholder属性.List属性.Autocomplete属性.Pattern属性.SelectionDirection属性.Indeterminate属性.Image提交按钮的宽高属性. 1.controls属性 在html5中,可以在标签内部放置一个表单元素,并且通过该标签的controls属性来访问该表单元素. 1 <body> 2 <script> 3 function setValue(){ 4 var label

html5学习资料

1.HTML5 学习网址 http://www.w3school.com.cn/html5/

Html5学习笔记1 元素 标签 属性

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML5学习笔记</title> </head> <body bgcolor="#90ee90"> 1.Html5的元素<br/><br/> 元素指的是从開始标签到结束标签的全部代码<

HTML5学习笔记(四):H5中表单新增元素及改良

方便布局 表单内容可以放在表单标签之外,这样做的好处是方便设计时不用考虑一定要将表单元素放在指定的form标签之下,只要指定元素适用于哪个表单即可,如下: 1 <form id="test" action="test.php" method="get"> 2 <input form="test" type="text" name="name"/> 3 </f