鼠标箭头样式改变和cursor属性

要在鼠标移动到元素上方时改变鼠标样式，您可以使用内联方法结合JavaScript的onmouseover事件和CSS的cursor属性来实现。

<div id="myDiv" onmouseover="changeCursor()">
  Move your mouse over me
</div>

<script>
function changeCursor() {
  var div = document.getElementById('myDiv');
  div.style.cursor = 'pointer';
}
</script>

在上述示例中，我们在div标签的onmouseover属性中添加了changeCursor()函数作为内联方法。当鼠标移动到div元素上方时，该函数将被触发。函数内部通过修改style属性的cursor属性来改变鼠标的形状为指针（pointer）。
cursor属性有哪些值

//常见的cursor属性
auto: 默认值，浏览器自动选择适当的鼠标指针样式。
default: 默认鼠标指针样式（通常是箭头）。
pointer: 手形指针，表示可点击的链接或按钮。
text: 文本光标，表示可编辑文本的区域。
move: 移动指针，表示可拖动元素。
crosshair: 十字线指针，表示可进行精确选择的区域。
help: 帮助指针，表示提供帮助信息的区域。
not-allowed: 禁止指针，表示禁止操作的区域。
wait: 等待指针，表示正在进行加载或处理的区域。
progress: 进度指针，表示操作正在进行中的区域。
grab: 手掌形指针，表示可拖动元素。
zoom-in: 放大镜指针，表示可进行放大操作的区域。
zoom-out: 缩小镜指针，表示可进行缩小操作的区域。