浅谈Browser_html/css_WEB-ITnose
程序员文章站
2022-06-12 10:01:55
...
作者：赵策
发表时间：2016-4-16
昨天给校计协做讲座，随便谈了谈html代码转变到网页这一过程，回来做了个简单的整理。以下仅为个人理解，如有错误欢迎指正。
为什么挑HTML这么一个语言来讲，因为无论是学过C、C++、Java或C#的人都知道，大部分的语言从代码转变成应用都会经过编译呀、链接呀这么一个过程，但HTML转变成网页是没有这个过程的。
从HTML到网页，中间更像是经过了一个“翻译”的过程，将代码语言翻译成视图语言。
要了解浏览器是如何翻译的，就先得清楚HTML到底是个什么东西。
在我个人看来，与其说HTML是一种语言，更不如说是一种规则、一种规范，浏览器只不过是应用了这种规范的一个程序，一个翻译工具。
中所周知：HTML代码分成 <head> 和 <body> 两部分， <head> 标签内主要是一些网站信息、引用文件，库之类的。 <body> 标签内则主要是网站所呈现出来的具体内容，包括一些文字，图片，或是视频之内的。
当浏览器读到代码中的 <head> 标签之后，按照约定，将其中的代码转变成网页信息，储存下来但不显示出来，直到读到 标签，浏览器退出之前这一状态。 接下来会读到 <body> 标签了，浏览器便会开始一个翻译，绘制的过程。
在这里先介绍一款古老的打印机：针式打印机。其原理是通过控制纸与打印针之间的相对位置来实现打印的。
浏览器翻译 <body> 标签的过程其实有点类似于这种针式打印机： 浏览器开始读代码，每逢遇到规则中写好的一些标识符（即html标签），将其按照html规则转换成相应的信息。
举个栗子，浏览器翻译绘制下面这段HTML代码：
<body><h1>这里是h1标签<a href="http://zhaoce.name">这里是a1标签<img src="img/01.png"><br><img src="img/02.png">