win10设置界面的鼠标移动显示周边的样式（探照灯效果）该怎么实现呢？-灵析社区

类似windows设置界面在前端开发时，使用css，该如何实现探照灯效果？如果css不行的话，那该如何实现呢？ ![hover](https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241027/1d54f3f6b1842042d5197ed2da379131.png)

阅读量：20

点赞量：0

问AI

老詹啊老詹

"DEMO1:Windows 10 grid hover effect" (https://codepen.io/jashgopani/pen/MWJzPzJ) "DEMO2:Windows 10 calendar effect CSS" (https://codepen.io/gubb/pen/PdZqKy) "DEMO3:Windows 10 calendar effect using HTML,CSS,JS" (https://codepen.io/jashgopani/pen/abpXKLZ) "教程 Windows 10 calendar hover effect using HTML, CSS, and vanilla JS" (https://link.segmentfault.com/?enc=GbpRlFXFw8ddQCrjKeV%2BDA%3D%3D.j4bBZTjQ%2FCikGeevAp6smlVoTUv%2B7IPCACwhftmRXrr6bFSWNrQDVUb2PeGuRlfL9dCEcMd13tjoN6b8jCpDo3va5YCkTp8FxgoJIkNyLcm98qPCo4ALfatrxWUYEM97) "教程 Windows 10 grid hover effect using HTML, CSS, and vanilla JS" (https://link.segmentfault.com/?enc=3f6SC98VFfLaKCN%2FsRz%2FmA%3D%3D.cjC7RHjm9khPMbhDYshff%2BpGSno8qNyxTizZ63tNmeticaxv5d%2B087VRtad45Rl%2B9Wxea2JIvN2oPOy96WLgn16bmyTv9HVr8MeaSX1YKM6wuBZwEa2bSilNeNKzTf0t)