HTML5学习笔记

1、HTML5受欢迎的理由:

  (1)世界知名浏览器厂商对HTML5的支持:微软,Google,苹果,Opera,Mozilla等厂商都推出了支持HTML5的浏览器版本。

  (2)顺应时代的要求

  (3)Internet Explorer 8

2、可以放心使用HTML5的理由:兼容性、实用性、非革命性的发展

3、HTML5要解决的问题:

  (1)Web浏览器之间的兼容性很低

  (2)文档结构不够明确

  (3)Web应用程序的功能受到了限制

4、HTML5中的标记方法

  <!DOCTYPE html>

  <meta charset="UTF-8">

  PS:之前的表示方法可以继续使用,但不可混用。

5、可以省略标记的元素:

  

6、boolean的属性

  <!--代表true的-->

  <input type="checkbox" checked>

  <input type="checkbox" checked="checked">

  <input type="checkbox" checked=" ">

  <!--代表为false的-->

<input type="checkbox">

7、省略引号

//当属性值不包括空字符串,<,>,=,’,”,等字符时,属性两边的引号可以省略。

  <input type=text>

8、新增的元素

  section元素:页面中的内容区块,如章节、页眉、也较或其他位置 <section>...</section>

  article元素:页面中的一块与上下文不相关的独立内容 <article>...</article>

  aside元素:article内容之外的、与article元素的内容相关的辅助信息 <aside>...</aside>

  header元素:页面的内容区块或整个页面的标题 <header>...</header>

  hgroup元素:用于对整个页面或页面中一个内容区块的标题进行组合 <hgroup>...</hgroup>

  footer元素:表示整个页面或页面中一个内容区块的脚注,一般包括创作者的姓名、创作日期以及坐着的联系信息 <footer>...</footer>

  nav元素:页面中的导航链接的部分 <nav>...</nav>

  figure元素:独立的流内容,一般表示文档主体流内容中的一个独立单元,使用figcaption元素添加标题。

  <figure>

  <figcaption>PRC</figcaption>

  <p>The People‘s Republic of China was born in 1949...</p>

  </figure>

  

  video元素:定义视频 <video src="movie.ogg" controls="controls">video元素</video>

  audio元素:定义音频 <audio src="someaudio.wav">audio元素</audio>

  embed元素:插入多媒体 <embed src=“horse.wav”/>

  mark元素:视觉上突出显示或高亮显示文字 <mark>...</mark>

  progress元素:表示运行中的程序,显示JavaScript中耗费时间的函数的进程  <meter>...</meter>

  time元素:表示日期、时间 <time>...</time>

  ruby元素:表示ruby注释 <ruby>汉字<rt><rp></rp></rt></ruby>

  rt元素:表示字符的解释或发音 <rt>...</rt>

  rp元素:定义不支持ruby元素的浏览器所现实的内容 <rp>...</rp>

  wbr元素:宽度不够时,自动换行

  <p>To learn AJAX,you must be fami<wbr>liar with the XMLHttp<wbr>
  Request Object.</p>

  canvas元素:表示图形 <canvas id="myCanvas" width="200" height="200"></canvas>

时间: 2024-11-06 07:28:36

HTML5学习笔记的相关文章

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学习笔记(二)——表单1

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

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

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

html5学习笔记2

css3选择器 1.通过元素的关键字,如p,div等 2.通过id属性 3.通过class属性引用 3.1通过class属性引用p标签,如:p.text{}//text样式只适用于p 4.通过任意键引用 例如:p[name]{}//仅引用带有name属性的p标签 p[name="my"]{}//仅引用带有name属性等于"my"的p标签 还可以使用正则表达式p[name^="my"]{} p[name$="my"]{} 5.通

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

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

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

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

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

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

HTML5 学习笔记--------》HTML5概要与新增标签!

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

html5学习笔记——html保留标签(三)

 列表和表格 这次也是复习. 列表: 列表分为无序列表.有序列表.标题列表 很简单,看代码 <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> 列表 <br/> 无序列表 <ul>a</ul> <ul>b</ul> &l

html5学习笔记(4)

XHTML可扩展的超文本标记语言 文档声明: DTD: html5与html4的区别 html5新增的元素: 结构元素:section ,article, aside, header,hgroup,footer, nav, figure 其他元素: video,audio, canvas, input,元素类型:Email, 全局属性: contentEditable disignMode hidden spellcheck tabindex <!DOCTYPE html> <html&