时间戳

首页 > 解决方案 > 悬停时无法更改css中的背景图像

html - 悬停时无法更改css中的背景图像

问题描述

col-lg-3我的容器里有 6 个。每个都div包括另一个div,h4和p。包含的 div 具有background-image, 和 CSS 中的一些属性。而且我想background-image在悬停的 div 上更改包含的col-lg-3div 但它只是忽略:hover并且没有发生任何事情。

我不仅尝试了 change background-images，还尝试了 change color、 addborders等。但没有回应。继承人之一div.col-lg-3...

.reasons .col-lg-3 div {
  width: 99px;
  height: 99px;
  margin: 10px auto 5px auto;
  background-size: 99px 99px;
  background-repeat: no-repeat;
  transition: 0.5s ease;
}

.community:hover div {
  background-image: url('img/communityReverse.png');
}
<div class="col-lg-3 community">
  <div style="background-image: url('img/community.png')"></div>
  <h4>Lorem ipsum dolor</h4>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>

.community:hover div{ ... }似乎不起作用，但例如.community:hover h4{ font-size: 30px; }好的，没问题。我看不出有什么问题

标签： htmlcssbackgroundhover

解决方案

您检查此代码您正在使用错误的代码

.community div:hover 
 {
    background-image: url('img/communityReverse.png');
 }

推荐阅读