你在浏览一篇网页时,就是在利用浏览器来查看 HTML文档。 HTML文档的全称是超文本标记语言(Hyper Text Markup Language), 其中的标记(Markup)是对文档的说明(annotate),它通过标签和属性来实现。

HTML文档是通过超文本传输协议(即HTTP: Hyper Text Transfer Protocol)在网上传输的。

一篇文档就是由其中的元素构成的,元素出现的前后顺序,被称之为文档流。 因为浏览器会依照这些元素的顺序而安排它们显示的位置。 要打破这种显示方式,可以给元素添加某些CSS属性,比如添加 float:left; 或 position:absolute。
动物与网页的对比
动物网页
骨架和筋膜Structure 结构层 HTML
肌肤和皮毛Presentation 表现层 CSS
感应机理Behavior 行为层 JS

HTML标签

在没有符合你要用的语义元素时, 你可以使用无语义的元素(比如 <div> 和 <span> ), 并通过给它们添加属性(比如 class和id 属性)来说明其意义。

属性名解释

src = source = 来源,出处;href = hyper reference = 超级参考,超级链接

文档对象模型 DOM(Document Object Model)

DOM是HTML文档的接口,通过它可以利用js脚动态地访问和修改文档中的元素。

在HTML文档中的每一个元素,都对应着DOM中的一个节点。 用脚本操作这个节点,就等价于操作文档中对应的元素。

节点层级

对象 document 与 HTML文档对应。也就是说,document等价于这篇HTML文档。

要获取文档内的元素,可通过以下方法:

document.getElementById(); document.getElementsByTagName(); document.getElementsByClassName();

节点之间的关系

基本事件

用户通过鼠标、键盘等工具,能与文档的元素进行互动,被称之为:事件。

至于怎么互动,取决于于元素的交互方式和对应的程序。

与元素的交互方式有:mousedown,mousemove,mouseover,mouseout,mouseup,keydown,keyup

以及组合:keypress = keydown+keyup;click = mousedown+mouseup;dbclick = click+click。

CSS值简写时的复制规则

字体单位的转换

1磅=1/72英寸=0.3527 毫米 1px=0.75pt px:pixel,像素,屏幕上显示的最小单位,用于网页设计,直观方便; pt:point,是一个标准的长度单位,1pt=1/72英寸,用于印刷业;

utf-8编码

字符编码

网页渲染流程