<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
</html>

所有浏览器支持基础结构标签

一、<!DOCTYPE> 声明文档规范类型

1、 必须是 HTML 文档的第一行,位于 <html> 标签之前;

  DOCTYPE是Document Type(文档类型)的简写;

  不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令;

  没有结束标签;

  对大小写不敏感。

2、作用。

  在默认情况下,标准浏览器和IE的解析标准不一样,不同浏览器的解析模型(document.compatMode)有所差异,如果声明标准不同,浏览器无法兼容。

alert(document.compatMode):
//BackCompat:怪异模式,浏览器使用自己的怪异模式解析渲染页面。
//CSS1Compat:标准模式,浏览器使用W3C的标准解析渲染页面。

  没有DOCTYPE声明,compatMode默认就是BackCompat,不同的浏览器就会显示不同的样式;

  如有DOCTYPE声明,开启标准模式,浏览器就按照W3C的标准解析渲染页面。

3、语法

HTML  顶级元素  可用性 "注册//组织//类型 标签//定义  语言""URL"

- 顶级元素:指定 DTD 中声明的顶级元素类型。这与声明的 SGML 文档类型相对应。 HTML 默认。HTML。
- 可用性:指定正式公开标识符(FPI)是可公开访问的对象还是系统资源。 PUBLIC 默认。可公开访问的对象。SYSTEM 系统资源,如本地文件或 URL。
- 注册:指定组织是否由国际标准化组织(ISO)注册。 + 默认。组织名称已注册。
- 组织名称未注册。Internet 工程任务组(IETF)和万维网协会(W3C)并非注册的 ISO 组织。
-组织:指定表明负责由 !DOCTYPE 声明引用的 DTD 的创建和维护的团体或组织的名称,即 OwnderID。 IETF IETF。 W3C W3C。
- 类型:指定公开文本类,即所引用的对象类型。 DTD 默认。DTD。
- 标签:指定公开文本描述,即对所引用的公开文本的唯一描述性名称。后面可附带版本号。 HTML 默认。HTML。
- 定义:指定文档类型定义。
  Frameset 框架集文档。
  Strict 排除所有 W3C 专家希望逐步淘汰的代表性属性和元素,因为样式表已经很完善了。
  Transitional 包含除 frameSet 元素的全部内容。
- 语言:指定公开文本语言,即用于创建所引用对象的自然语言编码系统。该语言定义已编写为 ISO 639  语言代码(大写两个字母)。 EN 默认。英语。
- URL:指定所引用对象的位置

4、种类

XHTML 1.0中有3种DTD(文档类型定义)声明可以选择:过渡的(Transitional)、严格的(Strict)和框架的(Frameset)。

1.过渡的:要求不很严格允许在页面中使用HTML4.01的标识(符合xhtml语法标准),写法如下:

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

2.严格的:要求严格不允许使用任何表现层的标识和属性,例如<br/>等,写法如下:

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

3.框架的:专门针对框架页面所使用,当页面中含有框架元素时采用这种DTD,写法如下:

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

  使用严格的DTD来制作页面,当然是最理想的方式。但是,对于没有深入了解Web标准的网页设计者,比较合适的是使用过渡的DTD。因为这种DTD还允许使用表现层的标识、元素和属性,比较适合大多数网页制作人员。

5、差异

  在 HTML 4.01 中,<!DOCTYPE> 声明需引用 DTD ,因为 HTML 4.01 是基于 SGML (Standard Generalized Markup Language 标准通用标记语言)规定了三种(Strict、Transitional 和 Frameset)不同的声明。DTD 指定了标记语言的规则,确保了浏览器能够正确的渲染内容。HTML5 不是基于 SGML,因此不要求引用 DTD。 HTML5 中仅规定了一种:

<!DOCTYPE html>

二、 <html></html>

  此元素可告知浏览器其自身是一个 HTML 文档。

  <html> 与 </html> 标签限定了文档的开始点和结束点,在它们之间是文档的头部和主体。

  注释:即使 html 元素是文档的根元素,它也不包含 doctype 元素。doctype 元素必须位于 html 元素之前。

  xmlns 属性在 XHTML 中是必需的,但在 HTML 中不是。不过,即使 XHTML 文档中的 <html> 没有使用此属性,W3C 的验证器也不会报错。这是因为 "xmlns=http://www.w3.org/1999/xhtml" 是一个固定值,即使您没有包含它,此值也会被添加到 <html> 标签中。

三、<head></head>

  定义文档的头部,它是所有头部元素的容器。

  可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。

  应该把 <head> 标签放在文档的开始处,紧跟在 <html> 后面,并处于 <body> 标签或 <frameset> 标签之前。

  文档的头部描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

下面这些标签可用在 head 部分<base><meta><script><style><title>。

四 、<body></body>

  body 元素定义文档的主体。

  body 元素包含文档的所有内容(比如文本、超链接、图像、表格和列表等等。)

五、<meta charset="UTF-8">

  字符集(charset):是一个体系援助的通盘笼统字符的集合。字符是各种文字和符号的总称,包括各国度文字、标点符号、图形符号、数字等。

  我们做网页时,如果指定的 Charset 是 GB2312,那么就不应该在网页中出现繁体字,因为 GB2312 标准只有几千个简体的中文字。如果我们的网页编码是 UTF-8,我们就不要指定字符集是 GB2312,因为虽然 UTF-8 编码对应的 UTF-8 字符集包含了 GB2312 的字符,但同一个字符在两个字符集中的编号不一样。下面这些编码方式,比如:中文 GBK ,繁体中文 Big5,每种语言的编码方式是不同的,所以需要使用charset为网页提供了一种编码方式,否则页面很可能出现乱码。"UTF-8"是国际字符编码,也就是独立于任何一种语言,任何语言都可以使用。

使用UTF8编码(国际化编码)
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
使用中文gbk编码
<meta http-equiv="content-type" content="text/html; charset=gbk" />
使用简体中文gb18030编码
<meta http-equiv="content-type" content="text/html; charset=gb18030" />
在XHML/HTML中使用
<meta charset="UTF-8" />
<meta charset="gbk" />
<meta charset="gb18030" />

六、<title></title>

  定义文档的标题。浏览器会以特殊的方式来使用标题,并且通常把它放置在浏览器窗口的标题栏或状态栏上。同样,当把文档加入用户的链接列表或者收藏夹或书签列表时,标题将成为该文档链接的默认名称。<title> 标签是 <head> 标签中唯一要求必须包含的东西。

  一定要选择一个正确的标题,这对于定义文档并确保它能够在 Web 上有效利用来说是十分重要的。

  请记住,用户可以用任何顺序、独立地访问文档集中的每一个文档。所以,文档的标题不仅应当根据其他文档的上下文定义,而且还要显示其自身的特点。含有文档引用排序的标题通常不是什么好标题。举个例子,像“第十六章”或“第五部分”这样的标题,对读者理解其内容方面毫无用处。描述性更强的标题,像“第十六章:HTML 标题”,或者“第五部分:如何使用标题”,这样的标题不仅表达了它在一个大型文档集中的位置,还说明了文档的具体内容,吸引读者更有兴趣读下去。

  自我引用的标题也没有什么用处。像“主页”这样的标题和内容毫无关系,类似的还有“反馈页”或“常用链接”等。你应该设计一个能够传达一定内容和目的的标题,令读者凭这个标题就可以判断是否由必要访问这个页面。“HTML <title> 标签的详细信息”,这就是一个描述性的标题,类似的还有“HTML <title> 标签的反馈页”等等。

  人们常常会花费大量时间去创建 Web 文档,但却经常只是因为一个不吸引人或无意义的标题,而把这些努力全都浪费掉了。当自动为用户搜集链接的特殊软件在 Web 上越来越流行时,只有网页的标题才会作为与页面相关的描述性词语,被插入到庞大的链接数据库中。因此,我们怎么强调这一点都不过分:请为自己的每个文档都认真地选择一个描述性的、实用的并与上下文独立的。

详细解析HTML基础结构的更多相关文章

  1. 1详细解析HTML基础结构

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. java类生命周期详细解析

    (一)详解java类的生命周期 引言 最近有位细心的朋友在阅读笔者的文章时,对java类的生命周期问题有一些疑惑,笔者打开百度搜了一下相关的问题,看到网上的资料很少有把这个问题讲明白的,主要是因为目前 ...

  3. springmvc 项目完整示例06 日志–log4j 参数详细解析 log4j如何配置

    Log4j由三个重要的组件构成: 日志信息的优先级 日志信息的输出目的地 日志信息的输出格式 日志信息的优先级从高到低有ERROR.WARN. INFO.DEBUG,分别用来指定这条日志信息的重要程度 ...

  4. include_path详细解析

    include_path详细解析     原文地址:http://www.laruence.com/2010/05/04/1450.html 1.php默认的包含路径为 .;C:\php\pear 即 ...

  5. Intent的详细解析以及用法

    Intent的详细解析以及用法      Android的四大组件分别为Activity .Service.BroadcastReceiver(广播接收器).ContentProvider(内容提供者 ...

  6. C++多态的实现及原理详细解析

    C++多态的实现及原理详细解析 作者: 字体:[增加 减小] 类型:转载   C++的多态性用一句话概括就是:在基类的函数前加上virtual关键字,在派生类中重写该函数,运行时将会根据对象的实际类型 ...

  7. 对MySQL DELETE语法的详细解析

    以下的文章主要描述的是MySQL DELETE语法的详细解析,首先我们是从单表语法与多表语法的示例开始的,假如你对MySQL DELETE语法的相关内容十分感兴趣的话,你就可以浏览以下的文章对其有个更 ...

  8. 转:二十一、详细解析Java中抽象类和接口的区别

    转:二十一.详细解析Java中抽象类和接口的区别 http://blog.csdn.net/liujun13579/article/details/7737670 在Java语言中, abstract ...

  9. 单表扫描,MySQL索引选择不正确 并 详细解析OPTIMIZER_TRACE格式

    单表扫描,MySQL索引选择不正确 并 详细解析OPTIMIZER_TRACE格式     一 表结构如下:  万行 CREATE TABLE t_audit_operate_log (  Fid b ...

随机推荐

  1. iOS 如果页面 A 跳转到 页面 B,A 的 viewDidDisappear 方法和 B 的 viewDidAppear 方法哪个先调用?

    如果页面 A 跳转到 页面 B,A 的 viewDidDisappear 方法和 B 的 viewDidAppear 方法哪个先调用? 1. - (void)pushViewController:(U ...

  2. 【托业】【新东方托业全真模拟】TEST09~10-----P5~6

    at no time 绝不,从不 takeover 收购 startup n.启动; 新兴公司(尤指新兴网络公司); 新兴公司,新开张的企业; specific具体的,特定的:factual 事实的, ...

  3. python框架之Flask(4)-上下文管理

    知识储备 偏函数 作用 偏函数,帮助开发者自动传递参数. 使用 import functools def index(a1, a2): return a1 + a2 # 原来的调用方式 # ret = ...

  4. 建立请求号 request

    1:获取TR号(一般由团队的负责人创建,发出) 2:进入 i7p系统 3:点击process 4:输入tr号 5:选中 正确的请求号,右键> process item> add task ...

  5. python进阶(二) 多进程+协程

    我们大多数的时候使用多线程,以及多进程,但是python中由于GIL全局解释器锁的原因,python的多线程并没有真的实现 实际上,python在执行多线程的时候,是通过GIL锁,进行上下文切换线程执 ...

  6. COM中参数标识

  7. java.lang.ClassNotFoundException: com.sun.xml.ws.spi.ProviderImpl解决办法

    问题现象: 这种很可能出现在独立一个简单示例项目中可以用,但是在把webService模块加入系统后,报出这类错误. Exception in thread "main" java ...

  8. FangDD Java编程规范

    我们采用<Oracle/Sun原生的Java编程规范>和<Google Java编程规范> Google Java编程风格指南 January 20, 2014 作者:Haws ...

  9. Why Choose MB SD C5 with Engineer Software

    MB SD C5 with engineer software performed good and now is released. Unlike the old clone C5 which us ...

  10. Centos7.4配置虚拟环境

    environment Centos7.4 Python3.7 download pip isntall virtualenv create environment virtualenv enviro ...