Home > Article > Web Front-end > How to change the background color of a div with css
How to change the background color of a div with css
- WBOYOriginal
- 2021-12-01 14:39:4410218browse
In CSS, you can use the ":active" selector and the "background-color" attribute to achieve the effect of clicking the div to change the background color. You only need to add "div:active{background-color:color" to the div element. Value;}" style is sufficient.
The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.
css How to click on a div to change the background color
We can use: active selector and background-color attribute to set click on the div to change the background color .
:active selector is used to select active links. The background-color property sets the background color of an element.
The example is as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
div{
width:200px;
height:150px;
border: 1px solid red;
background-color:red;
}
div:active{
background-color:black;
}
</style>
</head>
<body>
<div>鼠标点击div盒子</div>
</body>
</html>Output result:
(Learning video sharing: css video tutorial)
The above is the detailed content of How to change the background color of a div with css. For more information, please follow other related articles on the PHP Chinese website!