HTML5技术

1.html5究竟是什么 - scolia

字号+ 作者:H5之家 来源:博客园 2016-05-22 16:00 我要评论( )

1.html5的起源,历史背景 按照一般的套路,我这里应该对html5的起源和发展历史,其优越性等大书特书一番。但既然你有意识地专门去找类似的文章,说明你早有相应的认识,就算没有,类似的东西网上也一大堆。我这里就不写这些没有营养的东西了。所以这里略过了

1.html5的起源,历史背景……

  按照一般的套路,我这里应该对html5的起源和发展历史,其优越性等大书特书一番。但既然你有意识地专门去找类似的文章,说明你早有相应的认识,就算没有,类似的东西网上也一大堆。我这里就不写这些没有营养的东西了。所以这里略过了N个字…………

2.html5是什么?

  按照比较正式的说法,html系列的语言都被称为超文本标记语言,那究竟什么叫做超文本标记语言呢?

  首先,我们要建立一个概念,其实html页面就是一个文档,这和你打开一个word文档的行为相差无几。下面是一些实验: 

文本 文本文本文本

 

  以上的代码在浏览器中的访问效果是这样的:

  

 

 

 

 

 

 

 

  首先,他能够正常访问,并没有报错。但留心我的html代码的第一行,它并没有任何的标签,单纯就是两个字符,这里我们就可以得出第一个结论:

    1.在html文档中文字就算没有标签包裹的,也能够正常显示。

  再看看第三行,很明显html中不可能认识<scolia>这个标签,因为这是我瞎写的,这里可以得出第二个结论:

    2.在html文档中使用不被识别的标签,页面也能正常显示。

  第四行,我在一个不被识别的标签里也写了一个不被识别的属性,但依然能正常显示,这里可以得出第三个结论:

    3.在html文档中的标签中设置一个不被识别的属性,页面也能够正常显示。

  最后再看第二行,<span>是html文档内置的一个标签,也就是说它是可识别的,但是为什么他看起来和其他乱写的效果是一样的呢?

  为了说明这个问题,我有继续做了下面的实验:

文本文本

 

  其在浏览器显示的效果:

  

  这次的效果很明显,一个倾斜,一个加粗。<em>、<strong>和<span>都是内置的标签,为什么在效果上差别那么大呢?

  如果你之前有过学过一点脚本语言的话,下面的解释就很好懂了,因为它的行为和脚本语言其实还是很类似的。

  首先,我们能看到的内容其实就是一个文档,文档本身可以不包含任何标签,就像我们在word文档中看到的可以是单纯的文字一样。但是就像我们可以在word文档编辑文字的倾向和加粗一样,我们的文档查看器(也就是浏览器)也能做到。但是和word中使用鼠标和快捷键的编辑方式不同,html文档的编辑是通过标签的形式,就像上面实现的文字倾斜和加粗效果一样。

  若按照脚本语言的角度来讲,网页文档其实就是源码文件,而我们的浏览器就是脚本解释器,浏览器通过解释特定的标签而实现相应的功能。但和真正的脚本语言编程不同,浏览器并不强制要求所有文字都要标签包裹,也就是一个文件中可以只有部分的代码符合浏览器的语法,而浏览器也只解释那部分的代码,对于没有标签的或者是标签不识别的,都会忽略,当成普通的文字来显示。

  <em>、<strong>和<span>都是内置的标签,浏览器对这些进行标签解释以后(这个解释的过程也可以说是渲染),为其加上不同的效果。当然<em>、<strong>已经内置倾斜和加粗的效果,而<span>并没有内置任何效果,所以就造成了以上显示的区别。如果有一天浏览器为<span>标签也加上效果的话,或者为我之前写的<scolia>标签加上效果。那么,当我使用相应的标签的时候,就会有相应的效果。

  其实作为前端最大的痛苦不是如果构建代码,而是如何去兼容各种浏览器。我这里也用脚本语言的思想去解释为什么要兼容。

  首先,传统的脚本语言的解释器只有官方出的一种,最多也就是版本上的区别,但一定你选用了哪个版本,然后用这个版本的解释器是构建代码,那么任何时候,相同的代码,解释器解释后就结果就只有一种。

  但是,html语言的解释器是浏览器,而浏览器却不止一种,各各公司所出的浏览器在解释上有一定的差异,同一个公司的不同版本也有差异。而最大的困难是你能要求自己只使用某个解释器去解释代码,而不能要求你的用户都使用哪个浏览器去浏览你的网页。这样造成的结果就是同样的代码,在不同的浏览器就会有不同的效果。效果不同还好说,万一某个浏览器不支持某个语法,对html语言来说那段文字就会被当成普通文字来对待了,这也就是为什么要做兼容。

  其实我们也可以使用脚本语言的思想去理解css和JavaScript,如果你之前并不知道什么是脚本语言,那很抱歉可能这篇文章并没有办法帮助你理解。此时,你可能需要通过别的方式来自己理解了,只有自己正在理解的东西才是真正属于自己的。

 

  如果你想找视频还学习html5或者其他前端语言的话,你可以去

  反正是免费的,别说我是卖广告的。

  我的前端知识也是那里学来的,博客里的很多内容也是摘自那里的课件,外加自己的部分理解。这里写在这里就当作是参考文献的声明吧。

 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 我问我自己,你究竟想成为一个什么样的人? - Felix_ICanFixIt

    我问我自己,你究竟想成为一个什么样的人? - Felix_ICanFixIt

    2017-03-01 08:00

  • CoreCLR源码探索(二) new是什么 - q303248153

    CoreCLR源码探索(二) new是什么 - q303248153

    2017-01-12 09:04

  • CoreCLR源码探索(一) Object是什么 - q303248153

    CoreCLR源码探索(一) Object是什么 - q303248153

    2017-01-06 11:04

  • 到底是什么是前端工程化、模块化、组件化 - 碧霄中游

    到底是什么是前端工程化、模块化、组件化 - 碧霄中游

    2016-12-19 13:00

网友点评