前端页面是有哪三层构成，作用是？

网页分成三个层次，即：结构层、样式层、行为层。

 HTML：结构层 网页的结构或内容层是该页面的基础HTML代码。正如房屋的框架为房屋的其他部分构建了一个坚实 的基础，HTML的坚实基础创建了一个可以在其上创建网站的平台。 结构层用于存储客户想要阅读或查看的所有内容。HTML结构可以包含文本和图像，它包括访问者用 于浏览网站的超链接。这是在符合标准的HTML5中编码的，可以包括文本，图像和多媒体（视频，音频等）。 网站内容的每个方面都应该在结构层中表示。这允许关闭JavaScript的客户或无法查看整个网站的 CSS访问权限的客户（如果不是所有功能）。 

CSS：样式层 该层指示结构化HTML文档如何看待网站的访问者，并由CSS（层叠样式表）定义。这些文件包含有 关如何在Web浏览器中显示文档的样式说明。样式层通常包括基于屏幕大小和设备更改站点显示的 媒体查询。 网站的所有视觉样式都应位于外部样式表中。您可以使用多个样式表，但请记住，每个CSS文件都需 要HTTP请求才能获取它，从而影响站点性能。 

JavaScript：行为层 行为层使网站具有交互性，允许页面响应用户操作或基于一组条件进行更改。JavaScript是行为层最 常用的语言，但CGI和PHP也经常被使用。 当开发人员引用行为层时，大多数都是指在Web浏览器中直接激活的层。您可以使用此图层直接与 DOM（文档对象模型）进行交互。在内容层中编写有效的HTML对于行为层中的DOM交互非常重 要。在构建行为层时，应该像使用CSS一样使用外部脚本文件来优化速度和性能。

最准确的web前端页面分成三个层次，即：结构层、表示层、行为层。

结构层（structural layer）由 HTML 或 XHTML 之类的标记语言负责创建。标签，也就是那些出现在尖括号里的单词，对网页内容的语义含义做出了描述，但这些标签不包含任何关于如何显示有关内容的信息。例如，P 标签表达了这样一种语义：“这是一个文本段。”

表示层（presentation layer） 由 CSS 负责创建。 CSS 对“如何显示有关内容”的问题做出了回答。

行为层（behavior layer）负责回答“内容应该如何对事件做出反应”这一问题。这是 Javascript 语言和 DOM 主宰的领域。

网页的表示层和行为层总是存在的，即使我们未明确地给出任何具体的指令也是如此。此时， Web 浏览器将把它的默认样式和默认事件处理函数施加在网页的结构层上。例如，浏览器会在呈现“文本段”元素时留出页边距，有些浏览器会在用户把鼠标指针悬停在 某个元素的上方时弹出一个显示着该元素的 title 属性值的提示框，等等。