css - 悬停时出现带有动画按钮的 div

Question

有点难以用语言描述，所以我将从一个例子开始： http ://www.hairstylesdesign.com/

我可以实现类似的效果，当我将其值从 0% 不透明度设置为 100% 不透明度时，会出现深色背景。示例：.blackscreen { background:black; 不透明度：0%；} .blackscreen:hover {不透明度：100%;}

但问题在于嵌套在里面的 div。前任：

<div class="picture"> <div class="blackscreen"> <div class="buttons"> </div> </div> </div>

通过使父 div 的不透明度等于 0，它不会影响嵌套在里面的 div。我想知道这个人是如何实现这种效果的。

非常感谢您的帮助。

Answer 1

不透明度不是以百分比表示的值，从 0% 到 100%，它是从 0 到 1 的分数。

它是不可被子代覆盖的稀有属性之一。如果父项的不透明度为 0，则子项的不透明度应始终为 0。