HTML <style>
标签定义 HTML 文档的样式规则。它定义了 HTML 元素在浏览器中的呈现方式。我们将 CSS 代码写在 <style>
标签内。例如:
<style>
h1 {
color: red;
}
</style>
<h1>Heading</h1>
浏览器输出

在这里,<h1>
标签的样式来自 <style>
标签内的 h1
选择器。
HTML <style>
标签是放置在文档 <head>
中的特定标签之一。
多个 Style 标签
一个文档中可以有多个 <style>
标签。例如:
<style>
h1 {
color: red;
}
</style>
<style>
h2 {
color: blue;
}
</style>
<h1>Heading</h1>
<h2>Sub Heading</h2>
浏览器输出

在这里,我们使用不同的 <style>
标签为 <h1>
标签指定了 red
颜色,为 <h2>
指定了 blue
颜色。
冲突的样式
当同一个元素或多个元素有两个 <style>
标签时,这被称为冲突的样式。在这种情况下,后一个样式的值将应用于 HTML 元素。例如:
<head>
<style>
h1 {
color: red;
}
</style>
<style>
h1 {
color: blue;
}
</style>
</head>
<body>
<h1>This is a Header</h1>
</body>
浏览器输出

在这里,我们有两个样式标签定义了 <h1>
元素的样式。第二个 <style>
的值应用于 <h1>
标签。因此,<h1>
的文本颜色是蓝色。
style 属性
我们也可以使用 style
属性来设置 HTML 元素的样式。例如:
<p style="color: red; font-weight: bold;">This is styled using the style attribute.</p>
浏览器输出

在这里,您可以看到我们在 <p>
标签内使用了 style 属性来更改其 color
和 font-weight
。
style
属性是一个全局属性,即它可以应用于所有 HTML 元素。