[分享]css不能点击的鼠标形状

在 CSS 制作网页时，我们经常会遇到一些比较麻烦的问题。其中之一就是鼠标样式的问题。 有时候，我们希望当鼠标放在某些元素上时，它能够显示一个特定的样式，比如手指形状的图标，以表明这是一个可以被点击的...

在 CSS 制作网页时，我们经常会遇到一些比较麻烦的问题。其中之一就是鼠标样式的问题。

有时候，我们希望当鼠标放在某些元素上时，它能够显示一个特定的样式，比如手指形状的图标，以表明这是一个可以被点击的链接。但是，有时候我们会发现，即使设置了相应的样式，鼠标形状还是不会改变。

a {
  cursor: pointer;
} 

以上代码用于为所有链接设置光标形状为指针。但是，在某些情况下，这种设置可能会无效，比如当链接的父元素设置了 pointer-events: none 属性时，就会出现这种问题。

.parent {
  pointer-events: none;
}
.parent a {
  /* 这里的样式将不起作用 */
  cursor: pointer;
} 

这里的问题在于，当 pointer-events 属性设置为 none 时，鼠标事件会被父元素拦截，子元素将无法响应鼠标事件。所以，如果这个父元素是一个容器元素，里面包含了很多链接，那么这些链接的光标形状都将不起作用。

解决这个问题的方法就是，在一般情况下把光标样式放在链接的 css 里面写。但是，如果不起作用的话就要检查一下链接元素的上级元素，看有没有将事件拦截掉。如果存在这个情况，就要修改父元素的属性或者在特殊情况下直接在链接的 css 里面写顶层元素，这样就能改变鼠标形状了。