如何在鼠标悬停时显示元素

学习如何在鼠标悬停时显示元素。

将鼠标悬停在我身上。
当有人将鼠标悬停在上面的 div 上时,我就会显示出来。

如何在鼠标悬停时显示元素

第一步 - 添加 HTML:

<div class="myDIV">将鼠标悬停在我身上。</div>
<div class="gizle">当有人将鼠标悬停在上面的 div 上时,我就会显示出来。</div>

第二步 - 添加 CSS:

.gizle {
  display: none;
}
.myDIV:hover + .gizle {
  display: block;
  color: red;
}

亲自试一试

例子解释:

相邻同级选择器 (+) 选择与指定元素相邻的所有元素。

“相邻”一词的意思是“紧随其后”,上面的例子选择所有带有 class=".gizle" 元素的集合,这些元素在悬停时紧接着放置在带有 class=".myDIV" elementinin ardından.

ilgili sayfalar

ders:CSS bileşici