`
zhangyaochun
  • 浏览: 2566103 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

最近看的一篇文章-学习转载一下(页面html,head,body标签如果没有)

阅读更多

最近逛博文的时候看见一篇个人觉得比较有创意的博文,学习分享一下。
   在页面开发过程中省略html,head,body这三个标签是可以省略的。当然很多人也在别的书上或者http://www.w3.org看过。The html element represents the root of an HTML document.-----其实在标准中html元素是根元素,而且里面的Content model:A head element followed by a body element.----内容模型里面提出只能包含一个head元素和body元素,而且head必须在body之前。
   其实看到这里大家也会有一个疑问,如果我在页面完全不写三个元素,那么浏览器会不会报错,或者自动按照标准创建三个元素,或者按照什么原理来解析。呵呵,心动不如行动嘛,我也自己新建了一个html。
主要的结构也是很简单的
<!DOCTYPE html>
<h1>dawd</h1>
<p>ces</p>

下面是我自己用不同的浏览器解析生成的:
(1)Opera

(2)FF


 (3)IE8



 这边我暂时只是简单地举例了一下3个浏览器,但是结果也是一致的,当然我这边我没有在文档树里面加入一些<style>标签,如果你在测试demo的时候加入了,浏览器解析完会给你正确地放在指定的位置。

  浏览器始终创建一个head元素,并自上而下依次检查页面源码中的各标签,能够加入到head元素的标签都加入到head元素中,随后将剩余的元素分配到自动创建的body元素中。(引用了一下原作者的结论)。

 

---当然在这里可能会有一些人问---什么则称为“正确的放入指定的位置”。

   这边我也举个例:

 

The head element

The head element represents a collection of metadata for the Document.

 

Here is an example of a longer one:

<!DOCTYPE HTML>
<HTML>
 <HEAD>
  <META CHARSET="UTF-8">
  <BASE HREF="http://www.example.com/">
  <TITLE>An application with a long head</TITLE>
  <LINK REL="STYLESHEET" HREF="default.css">
  <LINK REL="STYLESHEET ALTERNATE" HREF="big.css" TITLE="Big Text">
  <SCRIPT SRC="support.js"></SCRIPT>
  <META NAME="APPLICATION-NAME" CONTENT="Long headed application">
 </HEAD>
 <BODY>
 ...

head元素的内容模型称为“metadate content”--元数据内容,一般包括:base、command、link、meta、noscript、script、style、title

 

 

 

  • 大小: 2 KB
  • 大小: 2 KB
  • 大小: 2.6 KB
分享到:
评论

相关推荐

    第14周-07章节-Python3.5-html的head内标签.avi

    第14周-07章节-Python3.5-html的head内标签.avi

    Html网页页面head区规范知识

     &lt;SCRIPT LANGUAGE="javascript" SRC="script/xxxxx.js"&gt;&lt;/SCRIPT&gt; &lt;br/&gt; 附&lt;body&gt;标签:  &lt;body&gt;标签不属于head区,这里强调一下,为了保证浏览器的兼容性,必须设置页面背景 &lt;body bgcolor="#...

    html文件head内部标记浅析(meta,link,base,body)

    一、META  META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能,又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法:

    美工之路 网页设计视频教程Html篇-03.body.head等.rar

    美工之路系列视频是为那些想从事网页前台设计的设计师们和网页设计爱好者量身定制的,本教程包含4个部分:HTML篇,CSS篇,Javascript篇和XML篇.不仅适用于网页设计的初学者,对中级以上水平的人员也有一定参考价值,使...

    elasticsearch-head-chrome-master.rar

    elasticsearch-head-chrome插件,谷歌扩展程序,导入即能使用,不需要任何其他配置,方便快捷。

    Head First HTML与CSS 第2版 扫描高清

    《Head First HTML与CSS(第2版)》对读者来说,将是一个系统学习创建工业标准Web页的体验,而不只简单地阅读:你将玩游戏、解决谜题、探索秘密,并以你从未想过的方式创建Web页。你还能学习HTML如何与CSS协同工作。...

    index.html

    -- 单标签(也称空标签):有头没有尾,结尾会有一个关闭符,可写可不写 --&gt; &lt;!-- charset="UTF-8":声明该文档的字符编码集是UTF-8,如果不写,就会导致中文乱码 --&gt; &lt;!-- mate标签可以描述该文档的作者,项目说明...

    Head First HTML5 Programming(中文版).pdf

    先等一下,Web页面?为什么不用HTML5创建成熟的Web应用呢?另外,为什么不使用现代技术,像在移动设备上一样轻松地应用到桌面浏览器呢?当然,你肯定希望使用最新的HTML5技术来完成,比如地理定位、视频、2D绘制、...

    elasticsearch-head插件

    elasticsearch-head插件,带有安装说明。

    HTML5head头标签.pdf

    HTML5head头标签.pdf

    Head First HTML与CSS 第2版.pdf

    《Head First HTML与CSS(第2版)》对读者来说,将是一个系统学习创建工业标准Web页的体验,而不只简单地阅读:你将玩游戏、解决谜题、探索秘密,并以你从未想过的方式创建Web页。你还能学习HTML如何与CSS协同工作。...

    vue-head:管理head标签的元信息,一种简单的方法

    头操作head标签的元信息,一种简单的方法由激励有关旧版本的语法,用法通过CDN ...&lt; script src =" https://cdnjs.cloudflare.com/ajax/libs/vue/*version*/vue.min.js " &gt; &lt;/ script &gt;&lt; script src ...

    nuxt 每个页面head标签内容设置方式

    在前面几节课程中,我们已经完成对首页,jokes查询页,About页面的开发,接下来,我们来看一下每个页面的head标签 内容,我们会发现这三个页面的标签一致,而且和nuxt.config.js配置文件的head配置保持一致; 所以...

    HTML S1 知识点总结

    北大青鸟s1 HTML 知识点总结 HTML5的优势 世界知名浏览器厂商对HTML5的支持:微软 、Google、苹果、Opera、Mozilla 市场的需求 跨平台 ...没有顺序,每个标签、标签独占一行(块元素) 默认没有标记

    linux离线安装es-head插件完整步骤以及安装包

    linux离线安装es-head插件完整步骤以及安装包:包括先安装nodeJs、grunt;再安装head。都是离线

    react-native-head-tab-view:带有头部整体滑动标签页(带有可折叠页眉的标签)

    React Native Head选项卡视图产品特点可滚动的标签所有标签页共享可折叠标题可折叠标题控制Tabview在垂直方向上的滑动可折叠标题可以响应事件在标签页中添加下拉刷新(v2.0〜) 为Tabview添加一个下拉刷新(v2.0.6〜...

    Head First HTML5 Programming(中文版)

    《Head First HTML5 Programming 中文版 》内容简介:你可能想创建具有动态性 交互性 包含丰富数据而且互连的Web页面 先等一下 Web页面 为什么不用HTML5创建成熟的Web应用呢 另外 为什么不使用现代技术 像在移动设备...

    ES-ElasticSearch-head-chorm插件.zip

    而ElasticSearch-head就是一款能连接ElasticSearch搜索引擎,并提供可视化的操作页面对ElasticSearch搜索引擎进行各种设置和数据检索功能的管理插件,如在head插件页面编写RESTful接口风格的请求,就可以对Elastic...

    Head First HTML with CSS & XHTML 源代码

    如果你曾经读过深入浅出(Head First)系列图书中的任一本,就会知道书中展现的是什么:一个按人脑思维方式设计的丰富的可视化学习模式。本书的编写采用了许多最新的研究,包括神经生物学、认知科学以及学习理论,这...

Global site tag (gtag.js) - Google Analytics