La propiedad backgroundColor en HTML DOM se usa para establecer o devolver el color de fondo de un elemento.
Sintaxis:
object.style.backgroundColor
- Devuelve el color de fondo de un elemento.
object.style.backgroundColor =
"color|transparent|initial|inherit"
- Se utiliza para establecer el color de fondo de un elemento.
Parámetro: hay cuatro parámetros aceptados por la propiedad backgroundColor
- color: esta propiedad contiene el color de fondo.
- transparente: por defecto el color de fondo es transparente.
- initial: establezca esta propiedad en su valor predeterminado
- heredar: hereda la propiedad de su elemento padre
Valores devueltos: Devuelve un valor de string, que representa el color de fondo.
Ejemplo 1:
html
<!DOCTYPE html>
<html>
<head>
<title>
Style backgroundColor Property
</title>
<script>
/* script to set background color */
function geeks() {
document.body.style.backgroundColor =
"lightgreen";
}
</script>
</head>
<body style="text-align:center">
<h1 style="color:green;">
GeeksForGeeks
</h1>
<h2>
Style backgroundColor Property
</h2>
<button type="button" onclick="geeks()">
Submit
</button>
</body>
</html>
Producción:
- Antes:
- Después:
Ejemplo 2:
html
<!DOCTYPE html>
<html>
<head>
<title>
Style backgroundColor Property
</title>
<style>
#geeks {
width: 250px;
height: 100px;
background-color: coral;
}
</style>
</head>
<body>
<center>
<h1 style="color:green;">
GeeksForGeeks
</h1>
<h2>
DOM Style backgroundColor Property
</h2>
<button onclick="geeks()">Submitt</button>
<div id="geeks">
<h1>GeeksForGeeks</h1>
</div>
<script>
function geeks() {
document.getElementById("geeks").style.backgroundColor =
"lightgreen";
}
</script>
</center>
</body>
</html>
Producción:
- Antes:
- Después:
Navegadores compatibles: los navegadores compatibles con la propiedad backgroundColor del estilo DOM se enumeran a continuación:
- cromo 1.0
- Internet Explorer4.0
- Firefox 1.0
- Safari 1.0
- Ópera 3.5
Publicación traducida automáticamente
Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA