要实现鼠标悬停在 div 层上时，div 的背景色改变，有以下几个步骤：
- 选中 div 元素
- 添加:hover 伪类
- 设置背景色
下面是完整的实现步骤：
Step 1：选中 div 元素
首先，我们需要在 HTML 中选中你要实现功能的 div 元素。你可以通过以下的 HTML 代码来创建一个 div 元素：
<div class="myDiv">鼠标悬停时颜色会变</div>
这里的 .myDiv 是一个类选择器，通过添加类名，可以方便我们选中所有具有相同样式的元素。
Step 2：添加:hover 伪类
:hover CSS 伪类代表鼠标悬停时元素的状态。我们可以使用 :hover 选择器，来在鼠标悬停时设置样式。
.myDiv:hover {
/* 设置鼠标悬停时的样式 */
}
Step 3：设置背景色
添加了:hover 伪类后，我们可以在其中设置需要改变的样式，来实现鼠标悬停时 div 背景色改变的效果。
.myDiv:hover {
background-color: red;
}
在这个例子中，当鼠标悬停在 myDiv 元素上时，元素的背景色将会变成红色。
以下是具体的两个示例：
示例一
<div class="myDiv1">鼠标悬停时背景色变红</div>
.myDiv1:hover {
background-color: red;
}
这个示例中，当鼠标悬停在 myDiv1 元素上时，元素的背景色将会变成红色。
示例二
<div class="myDiv2">鼠标悬停时背景色变绿</div>
.myDiv2:hover {
background-color: green;
}
这个示例中，当鼠标悬停在 myDiv2 元素上时，元素的背景色将会变成绿色。
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！