HTML 的 sup 标签允许你在网页上以上标格式显示文本。在本实验中，我们将演示如何使用 sup 标签创建上标文本。
注意：你可以在
index.html中练习编码，并学习如何在 Visual Studio Code 中编写 HTML。请点击右下角的 'Go Live' 以在端口 8080 上运行 Web 服务。然后，你可以刷新 Web 8080 标签以预览网页。
创建一个名为 index.html 的 HTML 文件，并设置基本的 HTML 结构。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Superscript Text</title>
</head>
<body></body>
</html>在 HTML 文件中添加 sup 标签。在 sup 元素的开闭标签之间，添加你想要显示为上标的文本。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Superscript Text</title>
</head>
<body>
<p>My email address is: user123<sup>@</sup>example<sup>.</sup>com</p>
</body>
</html>你可以使用 CSS 对 sup 标签进行样式设置，以调整其字体大小和垂直对齐方式。将以下 CSS 代码添加到你的 HTML 文件中：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Superscript Text</title>
<style>
sup {
font-size: smaller;
vertical-align: super;
}
</style>
</head>
<body>
<p>My email address is: user123<sup>@</sup>example<sup>.</sup>com</p>
</body>
</html>上标文本是数学符号的重要组成部分。你可以使用 sup 标签来表示指数和幂。例如，将以下代码添加到你的 HTML 文件中：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Superscript Text</title>
<style>
sup {
font-size: smaller;
vertical-align: super;
}
</style>
</head>
<body>
<p>The value of 2<sup>3</sup> is 8.</p>
</body>
</html>在本实验中，我们学习了 HTML 中的 sup 标签。我们了解了如何创建上标文本，并用它来表示指数和幂。我们还学习了如何使用 CSS 对 sup 标签进行样式设置。通过本实验学到的技能，你现在可以轻松地在 HTML 页面中添加上标文本。
