如何在 HTML 中编写 CSS?
超文本标记语言 (HTML) 是一种广泛用于创建网站的标记语言。标记语言以构建网页框架或骨架而闻名。这些框架无法完全独立运行，必须使用 CSS(层叠样式表)进行设计。CSS 作用于网页，使其更具视觉吸引力，并根据个人需求定制网站。本文旨在了解在 HTML 中编写 CSS 的各种方法。虽然 CSS 代码和 HTML 代码可以单独编写，并相互链接(外部 CSS)，但本文将讨论其他方法。
使用的方法
CSS 代码可以方便地编写在单独的文件中，然后链接到 HTML 文件。但是，要在 HTML 中集成和使用 CSS 样式，有多种方法可用 -
内联 CSS
内部 CSS
组合方法
内联 CSS
内联 CSS
内联 CSS 涉及直接在 HTML 元素中使用"style"属性。它可以快速且个性化地调整单个元素的样式。
在 CSS 中，样式是根据其特异性来确定的，可以用特异性分数来表示。每种方法都拥有唯一的特异性分数，排名较高的样式将优先显示在网站上。值得注意的是，内联 CSS 拥有最高的特异性分数，可以覆盖可能存在的其他样式。
虽然内联 CSS 具有某些优势，例如能够实现高度特异性的样式，但它也存在缺点。由于其高度特异性以及与其他样式冲突的可能性，管理内联 CSS 可能会变得繁琐。
算法
打开 HTML 文件并编写代码以打印文本。
通过在与文本相同的行中使用 style 属性，您可以更改颜色、背景颜色、字体大小和文本对齐方式。
要查看更改，请保存并检查。
示例
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title> Understanding Inline CSS </title> </head> <body> <p style='color: rgb(84, 12, 12);' > Inline CSS is written in the same line as that of the element.</p> </body> </html>
内部 CSS
内部 CSS 或嵌入式 CSS 是指使用相同的"style"属性在 HTML 文件的 head 部分编写 CSS 代码。这种格式的 CSS 代码易于管理和共享，但其特异性得分低于内联代码方法。
外部 CSS 和内部 CSS 之间的唯一区别在于，前者代码编写在单独的文件中，然后链接到外部 CSS，后者代码编写在 head 标签中的 style 标签中。
算法
在 head 标签中定义 style 标签。
定义元素类或类型，并选择所需的颜色、背景颜色、字体大小和文本对齐方式。
保存文件以检查更改。
示例
<html lang="en">
<head>
<style>
h1{
color: black;
font-size: 150%;
}
</style>
</head>
<body>
<h1>Internal CSS is coded in the style tag of head tag.</h1>
</body>
</html>
组合方法
上述两种方法也可以组合使用，以生成理想的输出。内联技术可用于定制某些文本，而内部方法则可作为所有文本的通用框架。这种方法被广泛使用，因为它兼具两者的优势，并有助于生成理想的输出。
算法
在 head 标签中定义 style 标签。
定义元素类或类型，并选择所需的颜色、背景颜色、字体大小和文本对齐方式。
保存文件以检查更改。
示例
<html lang="en">
<head>
<style>
h1{
color: black;
}
h2{
color: #1319;
}
p{
color: #1984;
}
</style>
</head>
<body>
<h1>Greetings of the day</h1>
<p>Markup Languages are known for building frameworks or skeleton for a webpage. This framework cannot work entirely on its own and should be designed using Cascading Style sheets. CSS works on the webpages to make it visually appealing and to customize the website to individual’s needs.</p>
<p style="color: rgb(224, 189, 249);"> External CSS is also an option.</p>
</body>
</html>
结论
正如本文所讨论的，CSS 代码的编写方法多种多样。选择方法时，个人应根据项目需求，考虑项目规模大小、内容是否简洁易懂，还是项目周期长、耗时长。
内联方法可以快速设置单个元素的样式并进行自定义，但这种方法可能难以管理且繁琐。另一方面，内部 CSS 则编写在 style 标签中的指定位置，可以为许多相似类型的元素设置样式，但这种方法缺乏表现力。
总而言之，编写 CSS 代码时应考虑具体性、结构和需求等因素。掌握在 HTML 中编写 CSS 的技巧，Web 开发过程将变得精彩纷呈。
相关文章
有用资源
html 参考教程 - 该教程包含有关 html 的更多信息:https://www.cainiaomax.com/html/
