概述
在本教程中，我们将深入探讨 HTML <style> 标签的使用方法。HTML <style> 标签允许你在 HTML 文档内部直接编写 CSS 样式。这种方法通常适用于创建简单或独立的网页，但对于大型项目，建议将 CSS 代码放置在外部的 .css 文件中以便维护和重用。
<style> 标签的语法
HTML <style> 标签的基本语法如下：
<style type="text/css">
CSS code goes here
</style>
其中，"CSS code goes here" 是你编写的 CSS 样式代码。注意，在 <style> 标签内部，不需要再使用 <style> 标签来引用 CSS 代码。
<style> 标签的位置
HTML <style> 标签通常放置在 HTML 文档的 <head> 标签内部，但也可以放置在 HTML 文档的任何地方。如果你将 CSS 代码放置在 <body> 标签内部，那么这些样式只会应用于该位置之后的元素。
<style> 标签中的注释
与其他编程语言类似，HTML <style> 标签中也可以添加注释。注释是一种不会被浏览器解析或执行的文本段落，它们通常用于提供有关代码的额外信息或进行调试目的。在 CSS 中，注释使用 /* ... */ 语法：
<style type="text/css">
/* This is a CSS comment. It won't affect the styles or be displayed in the browser. */
body { background-color: lightblue; }
</style>
<style> 标签中的基本样式示例
下面是一个简单的使用 <style> 标签添加 CSS 样式到 HTML 文档的示例：
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
h1 { color: blue; }
p { font-family: Arial, sans-serif; }
</style>
</head>
<body>
<h1>Welcome to My Website!</h1>
<p>This is a paragraph with custom styles applied using the HTML `<style>` tag.</p>
</body>
</html>
在上面的示例中，我们使用 <style> 标签为 <h1> 元素设置了蓝色字体颜色，并为 <p> 元素设置了 Arial 字体系列。
结论
HTML <style> 标签是一种快速简单地向 HTML 文档添加样式的方法，尤其适用于小型项目或原型开发。然而，随着你的网站变得越来越复杂和庞大，将 CSS 代码放置在外部的 .css 文件中是更好的做法，这样可以提高代码的可维护性、重用性和性能。