HTML（HyperText Markup Language，超文本标记语言）、CSS（Cascading Style Sheets，层叠样式表）和JavaScript（简称JS）是构建网页和Web应用的三大核心技术。它们各自有不同的作用和功能，以下是它们的简要介绍：
HTML，CSS，JavaScript，web前端零基础到精通一套搞定，专为Java程序员_优课it
1. HTML（超文本标记语言）
HTML 是网页的基础结构语言，用于定义网页的内容和结构。它通过各种标签（tags）来标记文本、图片、链接、表格等各种元素。例如：
<h1>到<h6>标签用于定义标题。<p>标签用于定义段落。<a>标签用于定义链接。<img>标签用于插入图片。
示例：
html
取消自动换行
复制
<!DOCTYPE html>
<html>
<head>
<title>示例页面</title>
</head>
<body>
<h1>欢迎来到我的网站</h1>
<p>这是一个使用HTML创建的简单网页。</p>
<a href="https://www.example.com">访问示例网站</a>
<img src="image.jpg" alt="示例图片">
</body>
</html>
2. CSS（层叠样式表）
CSS 用于控制网页的外观和布局。它可以设置颜色、字体、间距、布局等样式，使网页更加美观和具有吸引力。CSS 可以内联、内嵌或外部链接到HTML文件中。
示例：
css
取消自动换行
复制
/* 外部样式表 */
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
}
h1 {
color: #333333;
text-align: center;
}
p {
font-size: 16px;
line-height: 1.5;
}
3. JavaScript（JS）
JavaScript 是一种脚本语言，用于为网页添加交互性和动态功能。它可以操作HTML和CSS，响应用户事件（如点击、提交表单等），以及与服务器进行通信。
示例：
javascript
取消自动换行
复制
// 显示一个警告框
function showAlert() {
alert("这是一个JavaScript警告！");
}
// 更改段落文本
function changeText() {
document.getElementById("myParagraph").innerHTML = "文本已被JavaScript更改！";
}
在HTML中使用JavaScript：
html
取消自动换行
复制
<!DOCTYPE html>
<html>
<head>
<title>JavaScript示例</title>
<script>
function showAlert() {
alert("这是一个JavaScript警告！");
}
function changeText() {
document.getElementById("myParagraph").innerHTML = "文本已被JavaScript更改！";
}
</script>
</head>
<body>
<h1>JavaScript示例</h1>
<p id="myParagraph">这是一个段落。</p>
<button onclick="showAlert()">显示警告</button>
<button onclick="changeText()">更改文本</button>
</body>
</html>
总结
- HTML 定义网页的结构和内容。
- CSS 控制网页的外观和布局。
- JavaScript 为网页添加交互性和动态功能。
这三者结合在一起，可以创建功能丰富、视觉吸引人的网页和Web应用
