鼠标悬浮显示小手可抓取（CSS伪类）

一个开发需求的简单笔记

如图所示就是需求，悬浮要求是一个小手，按下去要求是可以抓取

因为太久不写css，所以很多属性都需要去看文档了，所以这里记录一下

平时我会在行内直接写

style="cursor: pointer"

这样小手就可以出来了

但是这个需要去应用一下伪类

然后我除了这个pointer，别的属性也忘了，所以就查了一下，这里直接给大家

那么我现在应该怎么用伪元素去写呢

        .item:hover {
            cursor: grab;
            filter: brightness(90%);
        }

        .item:active {
            cursor: grabbing;
        }

只需要在你所在的代码加上这个伪类就行
就可以实现效果了

这里的filter: brightness：

滤镜 filter: brightness(90%); 调节明亮度可以快速实现一个鼠标覆盖的动态效果，无需额外制作遮罩：

所以大家看到的图片刚放上去的时候会变一下色