一.HTML
HTML(HyperText Markup Language)即超文本标记语言,是用于创建网页和网页应用程序的标准标记语言。它不是一种编程语言,而是一种标记语言,通过一系列的元素(elements)来告诉浏览器如何显示网页上的内容,如文本、图片、链接、表格、列表等。
HTML 文档由一系列的标签(tags)组成,这些标签告诉浏览器如何显示内容。标签通常成对出现,例如
<p>
和
</p>
,其中
<p>
是开始标签,表示一个段落的开始,而
</p>
是结束标签,表示该段落的结束。不过,也有一些标签是自闭和的,比如
<img />
或
<br />
,它们不需要结束标签。
HTML 文档的基本结构包括以下几个部分:
- **
<!DOCTYPE html>
**:声明文档类型和HTML版本,例如<!DOCTYPE html>
表明这是一个HTML5文档。 - **
<html>
**:这个标签包裹了整个HTML文档的内容。 - **
<head>
**:包含了文档的元数据(metadata),如文档的标题(<title>
)、字符集定义(<meta charset="utf-8">
)、链接到样式表(<link rel="stylesheet" href="styles.css">
)和脚本文件(<script src="script.js"></script>
)等。 - **
<body>
**:包含了可见的页面内容,如文本、图片、视频、游戏、可交互的表单等。
下面是一个简单的HTML示例,展示了这些基本结构:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的第一个网页</title>
</head>
<body>
<h1>欢迎来到我的网页</h1>
<p>这是一个段落。</p>
</body>
</html>
二.CSS
CSS(Cascading Style Sheets)即层叠样式表,是一种用来为结构化文档(如HTML或XML)添加样式(字体、间距和颜色等)的计算机语言。CSS 可以控制网页的布局,以及文本、颜色、字体等几乎所有外观方面的东西。通过使用CSS,网页的样式和内容可以分离,这使得网站的内容更加易于维护和更新。
CSS 有几个关键的特点:
- 层叠(Cascading):CSS 允许来自多个源的样式信息被合并到一个文档中。这意呀着如果多个样式应用于同一个元素,浏览器将按照特定的规则(如重要性、源顺序和特异性)来决定哪个样式将最终应用于该元素。
- 继承和层叠:CSS 允许样式从一个元素“继承”到其他元素。这意味着如果你为某个元素设置了样式,那么它的子元素(在HTML结构中嵌套的元素)可能会继承这些样式,除非你为子元素明确指定了不同的样式。
- 选择器(Selectors):CSS 使用选择器来指定哪些元素应该被样式化。选择器可以是基于元素名、类名、ID、属性等的简单或复杂的表达式。
- 样式规则(Style Rules):每条CSS规则由选择器和一组声明组成。声明由属性和值组成,它们之间用冒号分隔,整个声明用分号结束。例如,
color: blue;
是一条声明,它指定了文本颜色为蓝色。 - 外部、内部和内联样式:CSS 可以通过三种方式添加到HTML文档中:作为外部样式表(在单独的
.css
文件中)、作为内部样式表(在HTML文档的<head>
部分中的<style>
标签内),或作为内联样式(直接在HTML元素的style
属性中)。
下面是一个简单的CSS示例,展示了如何改变HTML元素的样式:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS 示例</title>
<style>
/* 这是一个内部样式表 */
body {
background-color: lightblue;
}
h1 {
color: navy;
margin-left: 20px;
}
p {
color: gray;
}
</style>
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落。</p>
</body>
</html>
在这个示例中,我们使用了内部样式表来定义HTML文档的样式。我们为
body
元素设置了背景颜色,为
h1
元素设置了文本颜色和左边距,为
p
元素设置了文本颜色。当浏览器加载这个HTML文档时,它会应用这些样式,从而改变页面的外观。
三.JS
JS,全称JavaScript,是一种高级的、解释执行的编程语言,它是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。JavaScript 最初是由 Netscape 的 Brendan Eich 在1995年设计的,最初命名为 LiveScript,但后来 Netscape 与 Sun Microsystems 合作,将其更名为 JavaScript,以与 Java 语言产生关联(尽管它们之间并没有编程语言的直接联系)。
JavaScript 是一种广泛用于开发网页的脚本语言,它可以直接嵌入 HTML 页面中,并通过浏览器内置的 JavaScript 引擎执行。JavaScript 可以用来给 HTML 网页添加动态功能,比如响应用户的各种操作(点击、滚动、输入等)、操作 DOM(文档对象模型)以改变页面内容、发送和接收数据到服务器(通过 AJAX)、控制多媒体和图形(使用 HTML5 Canvas 或 WebGL)等。
JavaScript 的特点包括:
- 解释性:JavaScript 是一种解释性语言,这意味着它不需要预先编译成机器码即可执行。JavaScript 代码在运行时被浏览器中的 JavaScript 引擎逐行解释执行。
- 面向对象:虽然 JavaScript 是一种基于原型的语言,但它支持面向对象的编程范式,允许你使用对象、类(通过 ES6+ 中的类语法)和继承等概念。
- 事件驱动:JavaScript 允许你定义和响应 HTML 元素上的事件,如点击、滚动、键盘输入等。
- 跨平台:JavaScript 几乎在所有现代浏览器中都有支持,因此它是开发跨平台网页应用程序的理想选择。
- 动态类型:JavaScript 是一种动态类型语言,这意味着变量可以在运行时改变其类型。
- 异步编程:JavaScript 支持异步编程模式,如回调函数、Promises 和 async/await,这使得处理网络请求和等待长时间运行的操作变得更加容易。
JavaScript 的使用范围已经远远超出了浏览器的限制。通过 Node.js,JavaScript 可以在服务器端运行,用于构建高性能的网络服务器和应用程序。此外,JavaScript 还被用于开发移动应用(通过 React Native、Flutter 的 JavaScript 引擎等)、桌面应用(如使用 Electron 框架)和游戏(如使用 Phaser、Three.js 等库)。
版权归原作者 俊昭喜喜里 所有, 如有侵权,请联系我们删除。