前端页面由：结构层、表示层、行为层，三大层构成。
结构层（structural layer）
结构层为页面的骨架，用于搭建文档的结构；它是由HTML超文本标记语言来创建的，也就是页面中的各种标签，在结构层中保存了用户可以看到的所有内容。
结构层类似于盖房子需要打地基以及房子的悬梁框架。
HTML 用来定义网页的内容，例如标题、正文、图像等；
表示层（presentation layer）
表示层为页面的样式，用于设置文档的呈现效果；表示层是由CSS负责创建的层叠样式表，它的作用是如何显示有关内容。
如：装修房子需要什么风格
田园的、中式的、欧式的、自然风格、地中海等待
CSS 用来控制网页的外观，例如颜色、字体、背景等；
行为层（behaviorlayer）
行为层为页面的行为，用于实现文档的行为。行为层由JavaScript创建，表示网页内容跟用户之间产生交互性。
简单来说就是用户操作了网页，网页给用户一个反馈，行为层是JavaScript和DOM主宰的领域。
JavaScript 用来实时更新网页中的内容，例如从服务器获取数据并更新到网页中，修改某些标签的样式或其中的内容等，可以让网页更加生动。
在这三层之间还是存在着一些潜在的重叠区域，如：DOM 技术可以用来改变网页的结构。在 CSS 身上也可以看到相互重叠的例子。诸如 :hover 和 :focus 之类的预定义符号（伪 class 属性） 使我们可以根据用户触发事件来改变呈现效果。