HTML5学习笔记(一):HTML5基本概念
1、HTML的发展历程
HTML(1994年,W3C成立)
HTML2(1995年)
HTML3(1996年)
HTML4.0(1997年)
HTML4.01(1999年)——HTML5(2008年:最开始由WHATWG【Web Hypertext Application Technology Workoing GROUP】提出并创建,后由W3C制定为标准)
XHTML1.0(2000年)
XHTML1.1(2001年)
注:HTML5现在代表的是“HTML5以及所有相关标准”,包括了许多容易管理的分支。因此说“某某浏览器支持HTML5”是不准确的,其实任何浏览器支持的都是HTML5相关功能的子集。
2、HTML5的三个主要原理
- 不破坏Web:即HTML5的引入不会导致已有的网页无法工作;
- 修补牛蹄子路:牛蹄子路是指走起来不是最舒服但使用频率最高的路,HTML5选择使用对用户最适合的方式;
- 实用至上:HTML5中的所有规则都以实用为最终目标。
3、HTML5对废弃元素的处理
因为HTML5支持所有的HTML(包括HTML4.01和XHTML),因此它包含许多废弃的元素,这令许多新手感到困惑(比如我-_-),因为这样的话那些不遵从规范的人写出的页面可能包含废弃元素,为了解决这个问题,HTML5规范包含两个独立的部分:
- 面向Web开发人员,它要求开发人员摒弃坏习惯和废弃的元素;
- 面向浏览器开发商,它要求浏览器必须支持HTML中存在的一切,做到向后兼容,这样即使开发人员的代码中使用了废弃的元素,浏览器也可以正常显示。
4、HTML5的基本格式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>...</title>
<link href="style.css" rel="stylesheet" />
<script src="java.js"></script>
</head> <body>
<p>...</p>
</body>
</html>
5、HTML5所遵循的约定
- 必须包含<html>、<body>、<head>元素,并且页面定义自然语言(在<html>标签内);
- 标签全部小写且空标签要闭合,正确嵌套;
- 为所有的属性值加引号。
6、HTML5元素家族
- 新增的元素
| 类别 | |
| 用于构建页面的语义元素 |
<article>、<aside>、<figure>、<figcaption>、<header>、<footer>、<nav> <csection>、<details>、<summary>、<main> |
| 用于标识文本的语义元素 | <mark>、<time>、<wbr>(用于在某处断行,以前就有,现在已经列入规范) |
| Web表单及交互 |
<input>(非新元素,但新增了很多新类型)、<datalist>、<keygen>、<meter>、<progress> <command>、<menu>、<output> |
| 音频、视频及插件 | <audio>、<video>、<source>、<embed>(以前就支持,现在已经规范) |
| Canvas | <canvas> |
- 改变的元素
<small>:不再用于减少文本字体,用于”附属细则“,比如页面底部的那些法律条款;
<hr>:在HTML5中,表示主题的转换,即从一个主题变为另一个主题,默认额的格式不变,只不过含义不同;
<s>:不仅仅表示给文本加删除线那么简单,现在表示不再准确相关的内容。
7、对付旧版本的浏览器
- 平稳退化:某些新引入的元素可以为老的浏览器提供替代内容(比如<canvas>元素可提供使用Flash插件);如果用户浏览器不支持某项功能,应该选择使用不太花哨的方式;
- 借助于JavaScript:HTML5中的某些功能可使用优秀的JavaScript库(腻子脚本)来实现。
HTML5学习笔记(一):HTML5基本概念的更多相关文章
- HTML5 学习笔记--------》HTML5概要与新增标签!
一.HTML5概要 1.1.为什么需要HTML5 HTML4陈旧不能满足日益发展的互联网需要,特别是移动互联网.为了增强浏览器功能Flash被广泛使用,但安全与稳定堪忧,不适合在移动端使用(耗电. ...
- HTML5学习笔记<六>: HTML5框架, 背景和实体
HTML5框架 1. 框架标签(frame): 框架对于页面的设计有着很大的作用 2. 框架集标签(<frameset>): 框架集标签定义如何将窗口分割为框架 每个frameset定义一 ...
- HTML5学习笔记:HTML5基于本地存储SQLite的每日工作任务清单程序.[只支持chrome]
使用环境:Chrome 36.0...+ 技术:HTML5 目的:习练HTML5 功能概述:记录管理每天工作内容,便签清单 HTML5+CSS3呈现UI,JavaScript操作数据库,SQLite存 ...
- HTML5学习笔记1 HTML5 新元素
自1999年以后html4.0已经改变了很我,今天,在html4.01中的几个已经被废弃,这些元素在html5中已经被删除或重新定义. 为了更好地处理今天的互联网应用,html5添加了很多新元素及功能 ...
- HTML5学习笔记<三>: HTML5样式, 连接和表格
HTML样式 1, 标签: <style>: 样式定义 <link>: 资源引用 2. 属性: rel="stylesheet": 外部样式表 type=& ...
- HTML5学习笔记之表格标签
HTML5学习笔记之表格标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之基础标签 HTML5学习笔记之表格标签 HTML5学习笔记之表单标签 HTML5学习笔 ...
- html5学习笔记一
HTML5学习笔记 <video>标记:定义视频,Ogg.MPEG4.WebM三种格式 <video src=”movie.ogg” controls=”controls”> ...
- Html5学习笔记1 元素 标签 属性
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- .NET Remoting学习笔记(一)概念
目录 .NET Remoting学习笔记(一)概念 .NET Remoting学习笔记(二)激活方式 .NET Remoting学习笔记(三)信道 背景 自接触编程以来,一直听过这个名词Remotin ...
- 感谢各位亲们的大力支持,免费的HTML5学习课程《HTML5网页开发实例具体解释》连载已经结束了!
感谢各位亲们的大力支持,免费的HTML5学习课程<HTML5网页开发实例具体解释>连载已经结束了. 有兴趣的读者能够看我的博客,也能够看以下的链接逐个学习: 当里个当.免费的HTML5连 ...
随机推荐
- 错误 'Cannot run program "/home/uv/IDE/adt/sdk/platform-tools/adb": error=2, No such file or directory
转 Linux下Android SDK中adb找不到的解决方案 2013年04月22日 20:41:48 阅读数:7621 在Linux平台下配置Android SDK开发环境过程中,Eclipse会 ...
- bzoj1588: [HNOI2002]营业额统计(splay)
1588: [HNOI2002]营业额统计 题目:传送门 题解: 复习splay所以来刷个水... 题目描述不是特别清楚:应该是找第i天以前一个最小的营业额和第i天做差的最小值作为第i天的最小波动值 ...
- 在Android源码下编译jni所需要知道的事~
以下只是自己的一些总结,欢迎讨论 通过NDK编译jni网上有很多例子,在这我只总结在Android源码下编译 1.android源码环境下编译so包,编出来的.so的包前面不会自动给添加lib,NDK ...
- centos 出现的问题
1.DNS问题,导致yum没得源 echo "nameserver 8.8.8.8">>/etc/resolv.conf 2.CentOS 7最小化安装后找不到‘ifc ...
- SQL Server 获取两个日期间的日期
declare @start datetime declare @end datetime set @start = '2018-01-25' set @end = '2018-02-03' sele ...
- 在C#中运行PowerShell
C#中运行PowerShell需要用到System.Management.Automation.dll.在Visual Studio中可以通过NuGet添加引用,package名字为"Sys ...
- windows中安装redis的phpredis扩展
1. 下载php的redis扩展 打开网址 http://pecl.php.net/ (php的扩展库官网),搜索redis,进入地址:http://pecl.php.net/package/redi ...
- 通过修改路由,或者增加Route属性来控制访问webApi的路径
可以通过RouteConfig.cs文件中的路由规则来控制 通过为每个方法增加单独的[Route(“api/xx类/xx方法”)]
- 微信小程序-最新获取用户基本信息方案
如果只是单纯的展示用户信息,那么最简单的方案就是 文档中组件: <open-data type="groupName" open-gid="xxxxxx" ...
- hdu 5372 Segment Game 【 树状数组 】
给出一些操作, 0是将第i次增加的线段放在b位置,第i次放的线段的长度为i 1是将第b次增加操作放的线段删除 每次增加操作完之后,询问这条线段上面的完整的线段的条数 每次询问统计比这条线段左端点大的线 ...