谷歌浏览器 - Webkit 浏览器在悬停时更改时不会继承过渡背景颜色



当我将鼠标悬停在父级上时;或者具有从父级继承背景颜色的子级,两者的颜色都会随着CSS过渡而改变,但在Windows的Webkit浏览器中不会改变。子元素的背景不会更新。使用上面的切换器查看我网站左侧的导航区域

以下是简化的 HTML:

<div class="navigation_area">
  <label class="navigation_toggler_desktop">
  </label>
</div>  

和 CSS:

.navigation_area {
  background-color: rgba(159, 0, 0, 0.7);
  transition: background 0.12s linear 0s;
}
  .navigation_area:hover {
    background-color: rgba(159, 0, 0, 0.7);
  }
  .navigation_toggler_desktop {
    position: absolute;
    background-color: inherit;
  }

它在Ubuntu Linux的Chrome上正常工作,问题出在Windows上。以为到处都是相同的代码...在Windows中的Opera中也有同样的问题。所有其他浏览器都很好...

感谢任何帮助。

我设法通过将从.navigation_area的过渡移动到.navigation_area:hover来解决我自己的问题。现在子元素似乎在所有浏览器上正确继承了背景。仍然很奇怪为什么它只在 Windows 中引起 Chrome 和 Opera 的问题......无论如何

最新更新