第2讲 HTML5新特性
HTML5和CSS3.0在网页设计中的新特性和优势
HTML5和CSS3.0在网页设计中的新特性和优势作者：高春燕来源：《旅游纵览·行业版》2014年第05期互联网从诞生到繁荣的每个阶段，HTML这个简单而强大的标记语言都发挥着举足轻重的作用。
从简单的新闻列表到复杂的在线表格应用，结合JavaScript、CSS，前端工程师用这些简单的标记创建出一个个改变人们生活的应用。
一、引言现在使用最广泛的HTML4.0.1标准已经十余年没有重要更新，对于构建复杂的网页应用也越来越显得力不从心。
HTML5标准最早在2004年就由WHATWG提出，经过多年的演变及各个浏览器阵营的磨合，主流浏览器制造商都已经实现了主要的HTML5核心。
特别是近年来移动互联网的兴起，给HTML5的普及带来了更有利的设备环境和难得的商业契机。
二、HTML5的新特性和优势Html5新特性主要体现在：语义化标记、Form 表单增强功能、视频/音频、画布（Canvas）、可编辑内容、拖放、稳健的数据存储等方面。
HTML5 在网页的应用和表现上，相对于HTML4 提供了更好的支持。
（一）新的语义标签和属性1、简洁的 DOCTYPE，不使用版本提示，书写的文档将会适用所有版本的HTML。
简单易记的语言标签，写法上较之前更为简洁。
在 HTML5 中，空标签（如：br、img 和 input）并不需要闭合标签。
新增了一些新标签和属性。
新标签更具语义性，属性更直白。
3、Html5自带表单验证功能，可以减少开发者对表单验证功能的代码编写。
4、脚本和链接无需type属性了，代码可以简化如下：（二）新增画布canvas是HTML5新增用来作画的工具。
canvas元素使用JavaScript在网页上绘制图像.画布是一个矩形区域，在页面中插入 canvas 就像插入其他标记一样平常，可以直接绘制形状、图表、动画、游戏、图片作品等。
，现在可以不用Flash或其它插件就可以直接在网页上涂鸦了。
（三）丰富的应用程序接口（API）除了原先的DOM接口，HTML5增加了更多API，如用于即时2D绘图的Canvas API，定时媒体回放，离线数据库存储Web Storage API，通讯和网络的Communication APIS，文档编辑，拖拽控制，浏览历史管理，使用者可共享定位地理位置的GeolocationAPI，为Web应用提供后台处理的能力的Web Workers API等。
HTML5新特性总结
4.内嵌的媒体 video 用来嵌入任意视频格式 audio 用来嵌入音频格式
audio 和 video 元素可以包含额外的标记，用来描述音频和视频的内容
5.交互
details 元素表示在默认情况下可能不显示的详细信息。可选的 legend 元素可以提供详细信息的 摘要。details 元素的用途之一是提供脚注和尾注(收缩展开)
meta 表示指定范围内的数字值 meter 元素帮助浏览器和其他客户机识别 HTML 页面中的数量。它不要 求对元素内容应用任何特定的格式。但是，每个 meter 元素可以有最多 6 个属性，它们按照更适合机 器识别的形式表示这个数量：
value min low high max optimum 这些属性都应该包含一个十进制数字
地理位置获取流程： 1、用户打开需要获取地理位置的 web 应用。 2、应用向浏览器请求地理位置，浏览器弹出询问窗口，询问用户是否共享地理位置。 3、假设用户允许，浏览器从设置查询相关信息。 4、浏览器将相关信息发送到一个信任的位置服务器，服务器返回具体的地理位置。
位置请求方式： 单次请求
navigator.geolocation.getCurrentPosition(updateLocation, handleLocationErro r, options);
dialog 表示几个人之间的对话
3.语义性内联元素 m 或者 mark 表示文本被 “加上标志”，但是不一定要强调 time 表 示 一 个 时 间 值 ， time 元 素 可 以 帮 助 浏 览 器 和 其 他 程 序 识 别 出 HTML 页 面 中 的 时 间 。， 每 个 time 元素都应该有一个 datetime 属性，其中包含更适合机器识别的时间值，适合机器读取的时 间值可能对搜索引擎、日历程序等有帮助。
html5十个新特性
html5⼗个新特性HTML5⼗个新特性（⼀）语义标签（语义化标签为页⾯提供了更好的页⾯结构。
） HTML5的语义化标签包括： <section> - 代表⽂档中的⼀段或者⼀节；<nav> - ⽤于构建导航；<article> - 表⽰⽂档、页⾯、应⽤程序或⽹站中⼀体化的内容；<aside> - 代表与页⾯内容相关、有别于主要内容的部分；<hgroup> - 代表段或者节的标题；<header> - 页⾯的页眉；<footer> - 页⾯的页脚；<time> - 表⽰⽇期和时间；<mark> - ⽂档中需要突出的⽂字。
（⼆）增强型表单 HTML5 新增的表单属性placehoder 属性，简短的提⽰在⽤户输⼊值前会显⽰在输⼊域上。
即我们常见的输⼊框默认提⽰，在⽤户输⼊后消失。
required 属性，是⼀个 boolean 属性。
要求填写的输⼊域不能为空pattern 属性，描述了⼀个正则表达式⽤于验证<input> 元素的值。
min 和 max 属性，设置元素最⼩值与最⼤值。
step 属性，为输⼊域规定合法的数字间隔。
height 和 width 属性，⽤于 image 类型的 <input> 标签的图像⾼度和宽度。
autofocus 属性，是⼀个 boolean 属性。
规定在页⾯加载时，域⾃动地获得焦点。
multiple 属性，是⼀个 boolean 属性。
规定<input> 元素中可选择多个值。
（三）视频和⾳频视频播放：<video src=""><video>⾳频播放：<audio src=""></audio>（四）Canvas绘图<canvas width="1000" height="1000"></canvas>js内容var canvas = document.getElementsByTagName("canvas")[0];var context = canvas.getContext("2d");路径写法是常⽤的写法// 1.开始⼀条路径// 2.具体是个什么样的路径// 3.结束路径（可选，加上去以后就会成⼀个封闭的，不加就表⽰随时结束）常⽤在点的绘制上// 4.设置属性（颜⾊）只要是在绘制之前设置都是OK的，随便你放在第⼏步，但是的再绘制之前// 5.绘制（fill（）stroke（））context.beginPath(); //开始⼀条路径context.rect(10,10,100,100);context.closePath();context.fillStyle = "#f00";context.fill()context.beginPath();context.moveTo(340,10);context.lineTo(440,10);context.lineTo(440,110);context.lineTo(340,110);context.lineTo(340,10);// context.closePath();context.strokeStyle = "#0f0";context.lineWidth = "10"context.stroke()context.beginPath();context.moveTo(450,10);context.lineTo(550,10);context.lineTo(550,110);// context.lineTo(450,110);context.fillStyle = "#00f";context.fill() //实⼼绘制会⾃动的闭合// 画圆// 1.开始⼀条路径// 2.绘制圆的路径⽅法// 3.结束⼀条路径// 4.设置圆的属性// 5.开始绘制context.beginPath();// context.arc(x,y,r,起始⾓，结束⾓[，绘制的⽅向。
HTML5新特性
HTML5新特性HTML5在语法上与HTML4是兼容的，同时增加了很多新特性，从而使运用HTML5设计网页更加方便、简单，使用HTML5设计的网页也会更美观、新颖、有个性。
1.简化的文档类型<!DOCTYPE>声明位于HTML文档中最前面的位置，它位于<html>标签之前。
该标签告知浏览器文档所使用的HTML或XHTML规范。
在HTML4中，<!DOCTYPE>标签可以声明3种DTD类型，分别表示严格版本(Strict)、过渡版(Transitional)、和基于框架(Frameset)的HTML文档。
a)HTML4严格版本(Strict)DTD：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""/TR/xhtml1/DTD/xhtml1-strict.dtd">在上面的声明中，声明了文档的根元素是html，它在公共标识符被定义为“-//W3C//DTD XHTML 1.0 Transitional//EN”的DTD中进行了定义。
浏览器将明白如何寻找匹配此公共标识符的DTD。
如果找不到，浏览器将使用公共标识符后面的URL作为寻找DTD的位置。
如果需要干净的标记，避免表现层的混乱，可以使用此类型。
通常与层叠样式表（CSS）配合使用b)HTML4过渡版本(Transitional) DTD<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""/TR/xhtml1/DTD/xhtml1-transitional.dtd">过渡版本DTD可以包含W3C所期望移入样式表的呈现属性和元素。
如果用户使用了不支持层叠样式表（CSS）的浏览器。
HTML5和CSS3的新特性
HTML5和CSS3的新特性HTML5和CSS3是前端开发中最重要、最广泛使用的两种技术。
HTML5是用来描述和定义网页内容的标记语言，而CSS3则用来控制网页的样式和布局。
这两种技术都是基于Web标准的，它们的新特性不断地为Web开发带来便利和创新。
HTML5的新特性1. 语义化标签HTML5新增了很多语义化的标签，如article、nav、header、footer、section等，这些标签让页面结构更清晰，易于理解和维护。
语义化标签还有利于SEO优化。
2. 表单控件HTML5引入了一些新的表单控件，如date、time、color、email、url等，这些控件大大方便了用户的输入和选择，同时也增强了表单在移动端的体验。
3. 视频和音频HTML5允许在页面中直接嵌入视频和音频文件，不再需要使用Flash等第三方插件了。
这样不仅提高了网页的性能，也减轻了用户的安全风险。
4. Canvas和SVGHTML5中的Canvas和SVG都是用来制作图形的工具。
Canvas 是基于位图的，适合制作复杂的动画和游戏；SVG则是基于矢量图的，适合制作图标和矢量图形。
5. Web存储HTML5提供了两种Web存储机制：Web Storage和Web SQL Database。
Web Storage可以用来存储大量的文本数据，比如用户的设置、历史记录等。
Web SQL Database则可以存储结构化的数据，如书籍、商品等信息。
CSS3的新特性1. 选择器CSS3引入了更多的选择器，如属性选择器、伪类选择器、伪元素选择器等。
这些选择器让样式定义更加精细和灵活，同时也提高了代码的可读性和可维护性。
2. 盒模型CSS3中的盒模型允许开发者选择使用标准盒模型或者怪异盒模型。
标准盒模型中，元素的宽度和高度不包括内边距和边框；怪异盒模型中，元素的宽度和高度包括了内边距和边框。
这让样式的定义更加合理和统一。
3. 边框和背景CSS3的边框和背景提供了更丰富的样式选项。
Html5新特性
HTML5新特性目录概述 (1)1.新特性 (1)1.1 语义化标记 (1)1.2 表单增强 (1)1.3无需插件支持的视频/音频 (2)1.4 画布 (3)1.5可编辑内容、拖放 (4)1.6 稳健的数据存储 (4)2 废弃的标签 (5)3.缺点 (5)3.烟草集团数据中心与HTML5 (5)3.1 兼容性 (5)3.2 应用方面 (5)4 画布报表 (5)4.1 传统报表解决方案 (6)4.2 方案比较 (6)概述随着浏览器厂商对互联网浏览器思路的改进，从而诞生了HTML标准的原型，通过这几年的发展HTML标准已经到第五代。
近期用HTML5取代Flash或Shockwave的呼声越来越高。
虽然HTML5将会对互联网的很多方面做出改进，使网站具备更丰富的功能、让互联网访问变得更加安全和高效。
但距离HTML5成为标准还有很长的差距，目前包含IE在内的主流浏览器对HTML5的支持还不是完美，不过值得我们期待的是，新一代的IE9、Chrome 6、Firefox4等浏览器都已经开始全面的扩展对HTML5的支持。
1.新特性Html5新特性主要体现在:语义化标记、Form 表单增强功能、视频/音频、画布（Canvas）、可编辑内容、拖放、稳健的数据存储等方便，HTML5其实是关于图像，位置，存储，速度的优化和改进。
初步体验感受：简洁、华丽。
1.1 语义化标记简洁的DOCTYPE，有意不使用版本，因此文档将会适用所有版本的HTML。
简单易记的语言标签，写法上较之前更为简洁。
在HTML5 中，空标签（如：br、img 和input ）并不需要闭合标签。
新增的一些新标签更具语义，不过大多数都是原有标签的替代，提过得额外功能不是很多。
1.2 表单增强HTML5 为表单提供了几个新的属性、input 类型和标签。
例如：color, email, date, month, week, time, datetime, datetime-local, number, range, search, tel, 和 url等，使用这些标签将大大简化开发复杂度，比如使用date标签，我们将不再需要利用外包js就可以选择日期。
HTML5新特性基本操作解密
HTML5 新功能解密HTML5 基本新功能教程解密1) 什么是 HTML5？HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。
2) HTML5 是如何起步的？HTML5 是 W3C 与 WHATWG 合作的结果。
为 HTML5 建立的一些规则： 新特性应该基于 HTML、CSS、DOM 以及 JavaScript。
减少对外部插件的需求（比如 Flash） 更优秀的错误处理 更多取代脚本的标记 HTML5 应该独立于设备3) 新特性HTML5 中的一些有趣的新特性： 用于绘画的 canvas 元素 用于媒介回放的 video 和 audio 元素 对本地离线存储的更好的支持 新的特殊内容元素，比如 article、footer、header、nav、section 新的表单控件，比如 calendar、date、time、email、url、searchHTML 5 视频4) Web 上的视频HTML5 规定了一种通过 video 元素来包含视频的标准方法。
视频格式当前，video 元素支持三种视频格式： 格式 Ogg MPEG 4 WebM IE No 9.0+ No Firefox 3.5+ No 4.0+ Opera 10.5+ No 10.6+ Chrome 5.0+ 5.0+ 6.0+ Safari No 3.0+ No 1HTML5 新功能解密 Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件 MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件 WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件5) 如何工作<video src="movie.ogg" controls="controls"> </video> control 属性供添加播放、暂停和音量控件。
程序员必须知道的HTML5新特性
开发者必须知道的HTML5新特性众所周知，HTML是万维网的核心语言，是标准通用标记语言下的一个应用超文本标记语言。
然而HTML5的正式定稿却是来之不易。
2014年10月29日，万维网联盟宣布，经过接近8年的艰苦努力，该标准规范终于制定完成。
下面我们来探讨一下十大开发者必须知道的HTML5的新特性。
1. 新的文档类型(New Doctype)目前许多网页还在使用XHTML 1.0 并且要在第一行像这样声明文档类型：<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN''/TR/xhtml1/DTD/xhtml1-transitional.dtd'>在HTML5中，上面那种声明方式将失效。
尽管使用<!DOCTYPE html>，即使浏览器不懂这句话也会按照标准模式去渲染。
2.脚本和链接无需type在HTML4或XHTML中，你需要用下面的几行代码来给你的网页添加CSS和JavaScript文件：<link rel=”stylesheet” href=”path/to/stylesheet.css”type=”text/css”/><script type=”text/javascript” src=”path/to/script.js”></script>而在HTML5中，不需要type,直接使用如下代码即可：<link rel=”stylesheet” href=”path/to/stylesheet.css”><script src=”path/to/script.js”></script>3.重新定义<small>在HTML4或XHTML中，<small>元素已经存在。
然而，却没有如何正确使用这一元素的完整说明。
HTML5的新特性与应用
HTML5的新特性与应用随着互联网技术的不断发展，HTML5作为一种新的WEB标准，已经成为了互联网新时代网站开发的一种基础技术。
HTML5在保留了HTML4和XHTML的优点的同时，还引入了一些新特性和应用，使得网站和应用程序的开发更加方便、快捷和可靠。
一、HTML5的新特性1.新标签HTML5新增了许多语义化的元素标签，以便更好地定义网页内容。
比如，<header>、<footer>、<nav>、<article>、<section>、<aside>、<time>等等，这些标签让网页的结构更加清晰、易于理解和维护。
2.多媒体元素HTML5支持多媒体元素，包括<video>、<audio>等标签，使得开发者可以方便地在网页中嵌入视频和音频。
3.本地存储HTML5用localStorage和sessionStorage两个对象来提供本地存储功能，这比传统的cookie更加简单、可靠和安全。
4.地理定位HTML5提供了地理定位功能，使得web应用可以获取用户的地理位置信息，从而为用户提供更加精准的服务和信息。
5.Web WorkerHTML5提供了Web Worker功能，这使得浏览器可以在后台运行JavaScript程序，从而不会影响用户的正常操作。
二、HTML5的应用1.移动应用HTML5的新特性和应用让它成为了移动应用开发的重要技术，特别是在跨平台开发方面，HTML5的优势更加明显。
2.游戏开发HTML5的多媒体元素、canvas和Web GL等技术，使得开发者可以在网页中创建复杂的游戏和动画，其可玩性和视觉效果也越来越好。
3.视频和音频网站HTML5提供了多媒体元素和本地存储等功能，使得在线视频和音频网站的播放速度更快，缓冲更快，且可以在离线状态下进行。
例如：优酷、爱奇艺等。
4.社交网络应用HTML5的地理定位、Web Socket和Web Worker等技术，使得开发者可以很方便地开发社交网络应用，如微博、微信、QQ空间等。
HTML5有哪些新特征
HTML5有哪些新特征⼀、HTML5 中的⼀些有趣的新特性：⽤于绘画的 canvas 元素⽤于媒介回放的 video 和 audio 元素对本地离线存储的更好的⽀持新的特殊内容元素，⽐如 article、footer、header、nav、section新的表单控件，⽐如 calendar、date、time、email、url、search⼆、HTML5 视频<video>1、视频格式Ogg = 带有 Theora 视频编码和 Vorbis ⾳频编码的 Ogg ⽂件 MPEG4 = 带有 H.264 视频编码和 AAC ⾳频编码的 MPEG 4 ⽂件 WebM = 带有 VP8 视频编码和 Vorbis ⾳频编码的 WebM ⽂件2、<video> 标签的属性 *标签<source>规定多媒体资源，可以是多个3、实例 （1）复制代码代码如下:<!DOCTYPE html PUBLIC "-//WC//DTD XHTML . Transitional//EN" "/TR/xhtml/DTD/xhtml-transitional.dtd"> <html xmlns="//xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-" /><title>视频</title></head><body><video src=". HTML⾳频视频-编解码⼯具.mp" controls="controls" width="px" height="px"></video></body></html> 效果：（2）HTML5 <video> - 使⽤ DOM 进⾏控制（⽤JS来控制视频的播放/暂停以及放⼤、缩⼩） <⼩知识：在JS函数⾥输⼊console.log("hello");表⽰在浏览器控制台输出hello，若控制台可以输出hello，则表⽰函数是可以调⽤的。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
本章知识点
1.1 HTML基础 1.2 HTML4基础 （自学） 1.3 HTML5的新特性
1.1 HTML基础
1.1.1 什么是HTML 1.1.2 HTML的历史
1.1.1 什么是HTML
HTML是HyperText Markup Language（即超文本标记 语言）的缩写，它是通过嵌入代码或标记来表明文 本格式的国际标准。用它编写的文件扩展名是.html 或.htm，这种网页文件的内容通常是静态的。 HTML语言中包含很多HTML标记，它们可以被Web浏览 器解释，从而决定网页的结构和显示的内容。这些 标记通常成对出现，例如<HTML>和</HTML>就是常用 的标记对，语法格式如下： <标记名> 数据 </标记名>
face属性用于设置字体类型，size属性用 于设置字体大小。也可以使用color属 性设置字体的颜色。
【例1-2】
使用<b>…</b>定义加粗字体，使用<i>…</i>定义 倾斜字体，使用<u>…</u>定义下划线字体。这些 标签可以混合使用，定义同时具有多种属性的字体。 定义加粗、倾斜和下划线字体，代码如下： <p><b>加粗</b> <i>倾斜</i> <u>下划 线</u></p>
<!—和 -->是HTML文档中的注释符，它们 之间的代码不会被解析。
1.1.2 HTML的历史
1990年，欧洲原子物理研究所的英国科学家 Tim Berners-Lee发明了WWW（World Wide Web）。通过Web，用户可以在一个网页里比较 直观的表示出互联网上的资源。因此，Tim Berners-Lee被称为互联网之父。 最早的关于HTML的公开描述是由Tim BernersLee于1991年发表一篇叫做《HTML标签》的文 章，其中描述了18个元素，这就是关于HTML的 最简单的设计。其中的11个元素还保留在 HTML4中。
基本的HTML结构标记
结构标记 具体描述 <HTML>…</HTML> 标记HTML文档的开始和结束 <HEAD> … </HEAD> 标记文件头的开始和结束。HTML文档的头 部中可以包含脚本、CSS样式表和网页标题 等信息。这里指的脚本通常是Java Script脚 本，具体情况将在第2章介绍；关于CSS样式 表的具体情况将在第4章介绍
浏览【例1-6】的结果
1．通栏
被合并的单元格会跨越多个单元格，这 种合并的单元格被称为通栏。通栏可以 分为横向通栏和纵向通栏两种，<td colspan=#>用于定义横向通栏，<tr rowspan=#>用于定义纵向通栏。#表示通 栏占据的单元格数量。
使用<img>标记来处理动画
例如，在网页中插入一个多媒体文件 clock.avi，代码如下： <img border="0" dynsrc="clock.avi" start="fileopen" width="321" height="321"> dynsrc属性用于指定动画文件的文件名 ，包括文件所在的路径。start属性用 于指定动画开始播放的时间，fileopen 表示网页打开时即播放动画。
<BODY background="Greenstone.bmp">
可以在<BODY>标签中通过backcolor属性 设置网页的背景图片，例如：
<BODY bgcolor="#00FFFF">
<BODY>标签中的常用属性
属性 说明
BACKGROUND
BGCOLOR TEXT LINK VLINK ALINK
命名锚记（书签）
超级链接还可以定义在本网页内跳转 ，从而实现类似目录的功能。比较常 见的应用包括在网页底部定义一个超 级链接，用于返回网页顶端。首先需 要在跳转到的位置定义一个标识（锚 ），在DreamWeaver中这种定义位置的 标识被称为命名锚记（在FrontPage中 被称为书签）。 例如，可以在网页的顶部定义锚top， 代码如下： <a name="top"
HTML5编程
第2讲 HTML5概述
课程描述 互联网上的应用程序被称为Web应用程序，Web应用程序 使用Web文档（网页）来表现用户界面，而Web文档都遵 循标准HTML格式。HTML5是最新的HTML标准。之前的版 本HTML4.01于1999年发布。10多年过去了，互联网已经 发生了翻天覆地地变化。原有的标准已经不能满足各种 Web应用程序的需求。本章就和读者一起来了解一下最 新标准的HTML5的概貌。
文档的背景图像
文档的背景色 文档中文本的颜色 文档中链接的颜色 文档中已被访问过的链接的颜色 文档中正被选中的链接的颜色
1.2.2 设置字体属性
可以使用<font>…</font>标签对网页中的文字 设置字体属性，包括选择字体和设置字体大 小等，例如： <font face="黑体" size="4">设置字体 .</font>
1.2.4 图像和动画
HTML语言中使用<img>标签来处理图像，例如 ： <img src="pic.gif"> src属性用于指定图像文件的文件名，包括文 件所在的路径。这个路径既可以是相对路径 ，也可以是绝对路径。
<img>标记还有如下的属性
alt：当鼠标光标移动到图像上时显示 的文本。 align：图像的对齐方式，包括top（顶 端对齐）、bottom （底部对齐）、 middle（居中对齐）、left（左侧对齐 ）和right（右侧对齐）。 border：图像的边框宽度。 width 图像的宽度。 height 图像的高度。 hspace 定义图像左侧和右侧的空白。
<TITLE>…</TITLE> 标记文件头中的文档标题 <BODY>…</BODY> <!--…--> 标记文件体部分的开始和结束 标记文档中的注释部分
【例1-1】
一个使用基本结构标记文档的HTML文档实例。
<HTML> <HEAD> <TITLE> HTML文件标题.</TITLE> </HEAD> <BODY> <!-- HTML文件内容 --> </BODY> </HTML>
【例1-5】
定义一个新的超级链接，显示文本为“在新 窗口中打开PHP网站”，代码如下： <a target="_blank" href="">在新窗 口中打开PHP网站</a>
电子邮件超级链接的定义
在HTML语言中，电子邮件超级链接的定 义代码如下： <a href="mailto:johney2008@sin ">我的邮箱</a>
【例1-4】
下面的代码可以定义H1、H2……H6标题的文 字。 <h1>这是标题 1</h1> <h1>这是标题 2</h1> <h2>这是标题 3</h2> <h4>这是标题 4</h4> <h5>这是标题 5</h5> <h6>这是标题 6</h6>
浏览【例1-4】的结果
1.2.3 超级链接
转向同一文档中有锚的地方
创建锚是为了在HTML文档中创建一些链 接，通过这些链接可以方便地转向同一 文档中有锚的地方，代码如下： <A HREF="url#name">转到锚 name</A> 如果HREF属性的值是指定一个锚，则必 须在锚名前面加一个“#”符号。例如 ，在网页的尾部添加如下代码： <a href="#top">返回顶部</a>
HTML的历史
2004年，超文本应用技术工作组（Web Hypertext Application Technology Working Group，WHATWG） 开始研发HTML5。2007年，万维网联盟（World Wide Web Consortium，W3C）接受了HTML5草案，并成立 了专门的工作团队。并于2008年1月发布了第1个 HTML5的正式草案。 2010年，时任苹果公司CEO的乔布斯发表了一篇名为 《对flash的思考》的文章，指出随着HTML5的完善和 推广，以后再观看视频等多媒体时就不再依靠flash插件 了。这引起了主流媒体对HTML5的兴趣。 目前HTML5的标准草案已进入了W3C制定标准5大程序 的第1步。预期要到2022年才会成为 W3C 推荐标准。 HTML5无疑会成为未来10年最热门的互联网技术。
HTML的历史
1993年，Internet工程任务组（Internet Engineering Task Force，IETF）发布了第1 部HTML规范建议。1994年，IETF成立了HTML工 作组，该工作组于1995年完成了HT ML 2.0设 计，并于同年发布了HTML 3.0，对HTML 2.0进 行了扩展。 HTML 4.01发布于1999年，直至将现在仍然有 大量的网页是基于HTML 4.01的，它的应用周 期超过10年，因此是到目前为止，影响最广泛 的HTML版本。