前端语言串讲 | 青训营

一、前端语言的基本能力

HTML,CSS,JS都是单独的语言；HTML,CSS,JS构成前端技术基础；

（1）HTML：负责网页的架构；

（2）CSS：负责网页的样式，美化；

（3）JavaScript（JS）：负责网页的行为；

• HTML 是 Web 页面的基础结构。它用于描述网页的内容和结构。HTML 使用一系列标记（称为标签）来定义页面元素，如标题、段落、列表、图片和链接等。浏览器解析 HTML 代码，并根据标签的语义来显示页面内容。HTML 为网页提供了基本的骨架，使浏览器能够呈现文本、图像和其他媒体。

<p>前端语言串讲</p>

以上<p></p>就是HTML,“前端语言串讲”就是网页的内容。

• CSS 用于描述 HTML 元素的外观和布局。CSS 允许我们定义如何显示 HTML 元素，例如字体、颜色、大小、间距等。通过使用 CSS，我们可以将样式与 HTML 结构分离，使得网站的设计和维护更加简便。CSS 还允许我们根据不同的设备和屏幕尺寸应用不同的样式(媒体查询)，以实现响应式设计。

.a1{
            color:black;
            font-size: 20px;
            height: 10px;
            padding-left: 30px;
        }

以上表示背景是黑色，字体大小为20px,高度为10px,a1当做HTML里的一个元素。

• JavaScript 是一种脚本语言，用于在浏览器中增加交互性和动态效果。它允许我们编写脚本来处理用户操作，例如点击按钮、输入表单、拖动元素等。通过使用 JavaScript，我们也可以操作 HTML 和 CSS，动态更改页面内容和样式，从而提供丰富的用户体验。JavaScript 也可以与服务器进行通信，以便在不刷新整个页面的情况下获取或提交数据。

1、外联
<script src="./javascript.js"></script>
2、内嵌
<script>
 // JS
</script>

二、前端语言的协作配合

我们可以使用 HTML 创建网站的基本结构。包括主页将是什么以及它们的布局方式。HTML 将帮助我们构建一个包含标题和一些正文文本以及末尾的图像的主页。CSS 将帮助我们对已经构建的内容进行样式化。将向现有 HTML 添加 CSS 标记以添加颜色、样式和主题，例如背景颜色。创建网站的外观、感觉和结构后，就能使用 JavaScript 使页面更具交互性和功能复杂性。将鼠标悬停在它们上方时改变颜色，或者想要为图像设置动画等，JavaScript 可以添加这些功能，让我们的网站更具个性和活力。