📌  相关文章
📜  HTML | DOM 样式 backgroundColor 属性(1)

📅  最后修改于: 2023-12-03 15:15:36.543000             🧑  作者: Mango

HTML | DOM 样式 backgroundColor 属性

简介

在 HTML 中，使用样式可以改变文本的背景色。backgroundColor 属性用于设置 HTML 元素的背景色。

语法
object.style.backgroundColor = color

其中，object 是要设置背景色的 HTML 元素，color 是指背景色的值。color 可以是颜色名、十六进制值或 RGB 值等。

示例

以下示例演示如何设置 HTML 元素的背景色：

<!DOCTYPE html>
<html>
<head>
	<title>backgroundColor 属性示例</title>
	<style>
		p {background-color: yellow;}
	</style>
</head>
<body>

	<h1>backgroundColor 属性示例</h1>

	<p>这是一个带有黄色背景色的段落。</p>

	<script>
		// 使用 JavaScript 设置段落元素的背景色
		document.getElementsByTagName("p")[0].style.backgroundColor="blue";
	</script>

</body>
</html>
属性值

backgroundColor 属性的值有以下几种：

  • 颜色名：例如 red、green、blue 等；
  • 十六进制值：例如 #FF0000、#00FF00、#0000FF 等；
  • RGB 值：例如 RGB(255,0,0)、RGB(0,255,0)、RGB(0,0,255) 等；
  • RGBA 值：例如 RGBA(255,0,0,0.5)、RGBA(0,255,0,0.5)、RGBA(0,0,255,0.5) 等。
总结

backgroundColor 属性是 HTML 中用于设置背景色的属性，这个属性可以使用 JavaScript 进行动态设置。在设置属性值时，可以使用颜色名、十六进制值或 RGB 值等不同的方式。