一、HTML 基础
HTML（HyperText Markup Language）即超文本标记语言，是构建网页的基础。它通过各种标签来定义网页的结构和内容。
1. 常用标签
<html>：定义整个 HTML 文档。<head>：包含文档的元数据，如标题、样式表链接、脚本链接等。<title>：定义网页的标题，显示在浏览器标签页上。<body>：包含网页的可见内容。<h1>-<h6>：定义标题，从一级标题到六级标题，字号逐渐减小。<p>：定义段落。<a>：定义链接。<img>：插入图片。
2. 代码示例
以下是一个简单的 HTML 页面示例：
<!DOCTYPE html>
<html><head><title>我的第一个网页</title>
</head><body><h1>欢迎来到我的网页</h1><p>这是一个段落。</p><a href="https://www.example.com">点击这里访问示例网站</a><img src="image.jpg" alt="一张图片">
</body></html>
二、CSS 基础
CSS（Cascading Style Sheets）层叠样式表，用于控制网页的外观和布局。
1. 选择器
- 元素选择器：选择特定的 HTML 元素，如
p选择所有<p>标签。 - 类选择器：通过给元素添加
class属性，然后使用.classname来选择具有该类的元素。 - ID 选择器：使用
#idname选择具有特定id属性的元素。
2. 属性
color：设置文本颜色。background-color：设置背景颜色。font-size：设置字体大小。margin：设置外边距。padding：设置内边距。
3. 代码示例
以下是一个使用 CSS 美化 HTML 页面的示例：
<!DOCTYPE html>
<html><head><title>CSS 示例</title><style>h1 {color: blue;font-size: 36px;}p {color: green;font-size: 18px;}.highlight {background-color: yellow;}</style>
</head><body><h1>这是一个标题</h1><p>这是一个段落。</p><p class="highlight">这是一个突出显示的段落。</p>
</body></html>
三、JavaScript 基础
JavaScript 是一种用于网页开发的编程语言，可以实现网页的交互效果。
1. 变量和数据类型
- 变量：使用
let、const或var声明变量。 - 数据类型：包括数字、字符串、布尔值、数组、对象等。
2. 函数
- 定义函数：使用
function关键字定义函数。 - 调用函数：通过函数名加上括号来调用函数。
3. 事件处理
- 监听事件：使用
addEventListener方法监听特定的事件，如点击事件、鼠标移动事件等。 - 处理事件：在事件处理函数中编写代码来响应事件。
4. 代码示例
以下是一个使用 JavaScript 实现点击按钮改变文本颜色的示例：
<!DOCTYPE html>
<html><head><title>JavaScript 示例</title>
</head><body><button id="myButton">点击我</button><p id="myParagraph">这是一段文本。</p><script>document.getElementById('myButton').addEventListener('click', function () {let paragraph = document.getElementById('myParagraph');paragraph.style.color = 'red';});</script>
</body></html>
以上对是对 HTML、CSS 和 JavaScript 的简介，希望对您有所帮助。
