学习Html5建站教程(一)Html5简介

2024年04月17日 Html5简介 Html5 建站 教程 懒猪技术

Html5简介

Html5中的数字5表示这个标准是html的后续版本(在xhtml之前,html的版本号是4.01)。当然这个解释也不完全正确,因为在htnl5支持自html4.01发布以来的十年间出现在网页中的所有新东西,包括严格的xhtml风格的与法和大量的JavaScript创新。但不管怎么说,这个名字仍然很清楚的表明:html5虽然支持xhtml的规定,但它要求的则是html的规则。

提示:w3c官方html5标准的网址是:www.w3.org/TR/html5

Html5 实用至上:

Html5中添加了更多交互功能。拖放、可编辑的html内容、在Can中绘制二维图形等,这些功能在我们身边的网页中并不鲜见,只不过有的通过Adobe Flash或者微软的Silverlight等插件实现,还有部分用JavaScript代码来实现。Flash等浏览器插件不会一夜之间就消失(甚至随后几年都不会)。不过,html5的终极目标很清楚:让网站不依赖插件也能够提供视频、丰富的交互功能以及各种漂亮的效果。

Html5 文档类型:

每个html5文档的第一行都必须是一个特定的文档类型声明。

<!DOCTYPE html>

Html5的文档类型声明给人的第一印象是很简单的。特别是跟冗长的xhtml1.0文档类型声明比较,特点更明显:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

看到这如此复杂的文档类型声明,从来都是复制粘贴。

Html5的文档类型声明可以出发所有具备标准模式的浏览器的标准模式,包括那些对html5一无所知的浏览器,因此,从现在起,你可以在任何网页中都使用html5文档类型声明。

字符编码:

字符编码是一种编码,计算机根据它把文本转换成保存在文档中的字节序列。现在的编码有很多,英文的网站基本上使用的是UTF-8,杨青个人博客网站用的是gb2312简体中文编码。

如果没有添加字符编码,刚好用户浏览了UTF-8的网站后,又浏览了一个gb2312编码的中文网站,那么浏览器就会猜测,这种情况下,很可能造成网页乱码。因此最好在web标记中加上编码信息。

html5 <head>区域添加字符编码:

<meta charset="gb2312">

页面语言:

指明web中使用的语言是一种好习惯。这对搜索引擎和浏览器是有帮助的。

<html lang="en">

<html lang="zh-CN">

注:en定义语言为英语 zh-CN定义语言为中文。各国的语言代码查询:http://people.w3.org/rishida/utils/subtags/

添加样式表:

<link href="/skin/blog/css/base.css" rel="stylesheet">

过去网页要求的type="text/css"属性就没有必要了。

添加JavaScript:

<script src="/skin/blog/js/modernizr.js"></script>

省去了language=”JavaScript”属性。如果你在IE中要花大量的时间测试包含JavaScript页面,还应该在head区域中包含一行特殊的注释:web标志(mark of web)这行注释要放在指定字符编码的元素标签后面,例如:

<head>

<meta charset="gb2312">

<!--saved from url=(0014)about:internet -->

<title>学习Html5建站教程(一)Html5简介</title>

<script src="/skin/blog/js/modernizr.js"></script>

</head>

这条注释告诉IE将页面视为从远程网站上下载下来的。否则,IE会切换到一种特殊的锁定模式,弹出一条安全警告,在你点亮“允许阻止的内容”按钮之后才会执行JavaScript代码。其他所有浏览器都会忽略这个“web标志”注释。对远程站点和本地文件使用相同的安全设置。

本节最终结果:

如果你按照上面的步骤做了,那么会是这样一个html5文档:

<!DOCTYPE html>

<html lang="zh-CN">

<head>

<meta charset="gb2312">

<title>学习Html5建站教程(一)Html5简介</title>

<link href="/skin/blog/css/base.css" rel="stylesheet">

<script src="/skin/blog/js/modernizr.js"></script>

</head>

本文链接:http://so.lmcjl.com/news/2349/

展开阅读全文
相关内容