前端技术包括哪些

1、HTML(超文本标记语言)

HTML(或超文本标记语言)是一种计算机语言,旨在创建以后任何访问 Internet 的人都可以浏览的网站。HTML 通常用于构建 Web 文档。它定义了标题或段落等元素,并支持嵌入图像、视频和其他媒体。

HTML 是如何工作的?

HTML 由一系列称为tags的短代码组成,由站点创建者规范化为文本文件。然后将文本存储为 HTML 文件并通过浏览器进行观察。浏览器扫描文件并将文本解释为可见的形式,并且在较好的情况下,按照设计者的计划呈现页面。

  • 超文本是我们通过单击超链接在网络上旅行的方式——特定文本将您带到其他页面。超意味着它是非线性的,它允许移动到任何其他地方,因为没有预定义的顺序。
  • 标记决定了 HTML 标记应用于其中的文本的质量。标签将其标记为特定类型的文本。
  • 作为一种语言,它像任何其他语言一样拥有代码字和语法。

2、CSS(层叠样式表)

CSS(或层叠样式表)是一种样式表语言。它用于定义 HTML 元素在设计、布局和不同屏幕尺寸的不同设备的变化方面应该如何呈现在网页上。CSS 一次掌握许多不同网页的布局。

CSS怎样运作?

CSS 与 HTML 元素(网页的组件)交互。

  • 为了与 HTML 通信,CSS 使用选择器。选择器是 CSS 代码的一部分,用于定义 CSS 样式将影响哪个 HTML 片段。
  • 声明包含选择器使用的属性和值。
  • 属性定义字体大小、颜色和边距。值是这些属性的设置。

CSS 是通过计算机上的文本编辑器或文字处理器以纯文本形式编写的。如果您要检查 CSS 代码是如何实现到 HTML 内容的,有以下三种方法:

  • 外部样式表存储为 .css 文件,可用于通过单个文件定义整个网站的外观,而不是将额外的 CSS 代码实例添加到必须修改的每个 HTML 元素中。要使用外部样式表,.html 文件需要包含一个连接到外部样式表的标题部分。
  • 内部样式表是直接放入特定 .html 页面标题的 CSS 说明。
  • 内联样式是记录在 HTML 代码中的 CSS 片段。

CSS框架

CSS 框架是一组默认的 CSS 和 HTML 文件。它扩展了前端开发人员的网站设计能力。除了在构建响应式设计时提供帮助之外,CSS 框架还呈现出独特的对称布局,使开发人员无需在任何情况下从零开始编写代码。它们通常被认为是适合不同平台和屏幕尺寸的不错选择。借助通用的用户界面组件、网格系统、布局和许多其他功能,CSS 框架大大加快了开发工作流程。CSS Universe 中存在许多框架:

  • 功能齐全(Bootstrap、Foundation、语义 UI 等),
  • 针对 Material Design:(Materialize 和 Material Design Lite)
  • 轻量级。

预处理器——Sass和LESS

起草 CSS 是例行公事,而诸如查找颜色值、关闭标签或任何其他重复性操作之类的短任务需要大量时间。这就是预处理器派上用场的地方。CSS 预处理器是一种脚本语言,可扩展 CSS 并将其组装成通用 CSS。

Sass 和 LESS 是最常见的预处理器。它们共享一些共同的基础知识,例如:

  • 语法元素和
  • 向后兼容普通 CSS 文件。

但是,它们之间也有很多不同之处。

  • Sass 的意思是语法上很棒的样式表。Sass 在 Ruby 上运行并在服务器端呈现。由于其 Ruby 语言起源,安装是通过所谓的 gems(多个 Ruby/Rails 库)提供的。
  • LESS 代表更精简的样式表。它是一个 JavaScript 库,在浏览器的客户端呈现。开发人员在使用带有样式表的 JavaScript 时会更频繁地选择 LESS。它类似于编写常规 CSS。该技术允许在 LESS 文件中重用 CSS 片段。

3、DOM(文档对象模型)

文档对象模型 (DOM) 被定义为 HTML 和 XML 文档的编程接口。它解释页面,以便程序可以修改文档结构、样式和内容。DOM 将文档呈现为节点和对象,使编程语言能够连接到页面。

DOM如何运作?

将网页视为可以在浏览器窗口中呈现或作为 HTML 源代码呈现的文档。文档对象模型 (DOM) 表示此文档,因此可以对其进行修改。DOM 是网页的面向对象的表示,可以使用 JavaScript 等脚本语言进行更改。

DOM 必须遵守在大多数当前浏览器中执行的W3C和WHATWG标准。现代 DOM 是使用多个协同工作的API构建的。核心DOM指定了完全解释文档的对象和其中的对象。

4、JavaScript

JavaScript (JS) 是最流行的脚本语言之一。它以为前端和后端开发提供全套技术而闻名。正如我们所讨论的名列前茅个,它用于使网页动态化。

JavaScript 是如何工作的?

JS 提高了网站的整体交互性。它支持对动画 UI 组件进行建模,例如图像滑块、弹出窗口、广泛的站点导航菜单等。JavaScript 为网站提供了单独使用 HTML 和 CSS 无法实现的扩展功能。JavaScript 允许网页回复用户的操作并动态刷新自己。多亏了 JavaScript,这个过程不需要重新加载页面来改变它的表示。

JavaScript 框架和库

刚进入这个专业领域的人可能会认为框架和库做同样的事情,允许不同的视觉元素相互交互。老实说:这与事实相差不远。然而,有一些显着的特点。所以,让我们定义什么是 JS 框架,什么是 JS 库,以及它们的用途。

框架是用于创建网站或 Web 应用程序的模板。它们提供了一个结构(例如骨架或脚手架)来安排整个项目。在框架设置页面模板的同时,它们构建具有特定分配区域的结构以嵌入框架代码。

因此,JavaScript 框架是形成和安排网站或 Web 应用程序的完整工具集。

是一组预先编写的代码片段,用于实现 JavaScript 的核心功能并被重用。必要时,该片段可以轻松集成到现有项目代码中。

因此,库是针对特定编码需求的专用工具,而不是用于修饰整个现有项目的通用机器。

有哪些JS框架和库

Published by

风君子

独自遨游何稽首 揭天掀地慰生平