CSS设置下拉框hover时cursor为default不生效问题求助

你遇到的光标样式不生效问题有两个核心诱因：

1. 下拉容器.applesauceDropdown仅在:hover伪类下设置了cursor: default，且子元素（尤其是<a>标签）的默认光标样式优先级更高，会覆盖父容器设置：<a>标签默认自带cursor: pointer属性，你没有针对性覆盖这个样式，所以鼠标滑到下拉框里的链接区域时，仍然会显示指针样式。
2. 你通过.applesauce button:hover + .applesauceDropdown触发下拉显示时，该规则下的cursor设置仅在鼠标还停在按钮上时生效，鼠标移到下拉区域后该规则失效，若此时没有其他全局的cursor设置作用于下拉容器，就会出现样式异常。

需要调整2处CSS配置：

• 给.applesauceDropdown基础样式直接添加cursor: default，不需要限定在:hover状态下
• 给下拉框内的<a>标签单独添加cursor: default覆盖默认样式

修改后完整CSS代码如下：

.applesauce{
  text-align: right;
  margin-right: -0%;
  height: -10%;
  margin-top: -70%;
}
.applesauce button{
  text-align: right;
  margin-right: -18%;
  font-size: 200%;
  margin-top: 47%;
  font-style: italic;
  font-family: inherit;
  border: none;
  background-color: #3498DB00;
  color: #0d0d0d;
}
.applesauceDropdown button{
  text-align: right;
  margin-right: 8%;
  font-size: 110%;
  margin-top: 0%;
  font-style: italic;
  font-family: inherit;
  border: none;
  background-color: #3498DB00;
  color: #0d0d0d;
}
.applesauceDropdown{
  display: none;
  position: absolute;
  box-shadow: 0px 8px 16px 5px rgba(0,0,0,0.2);
  right: 23%;
  cursor: default; /* 新增：基础样式直接加默认光标 */
}
.applesauce a{
  color: black;
  font-size: 110%;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
  cursor: default; /* 新增：覆盖a标签默认指针样式 */
}
.applesauce button:hover + .applesauceDropdown{
  display: block;
}
.applesauce button:hover{
  color: #666666;
}
.applesauceDropdown:hover{
  display: block;
}
.applesauceDropdown button:hover{
  color: #666666;
  cursor: pointer; /* 保留按钮的指针样式，符合交互预期 */
}

修改后下拉框空白区域、链接区域都会显示默认光标，只有悬停在「read more」按钮上时才会显示指针样式，符合预期效果。

内容的提问来源于stack exchange，提问作者Arno.B