鼠标指针样式 cursor属性

cursor属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状 

下面列举的是各种样式的指针

      <div style="cursor: auto">auto</div><br />
      <div style="cursor: crosshair">十字</div><br />
      <div style="cursor: default">默认的</div><br />
      <div style="cursor: e-resize">e-调整</div><br />
      <div style="cursor: w-resize">w-调整</div><br />
      <div style="cursor: n-resize">n-调整</div><br />
      <div style="cursor: s-resize">s-调整</div><br />
      <div style="cursor: ne-resize">ne-调整</div><br />
      <div style="cursor: sw-resize">sw-调整</div><br />
      <div style="cursor: nw-resize">nw-调整</div><br />
      <div style="cursor: se-resize">se-调整</div><br />
      <div style="cursor: help">帮助</div><br />
      <div style="cursor: move">移动</div><br />
      <div style="cursor: pointer">指针</div><br />
      <div style="cursor: progress">前进等待</div><br />
      <div style="cursor: text">文本</div><br />
      <div style="cursor: wait">等待</div><br />

 有时候需要自定义样式的光标指针，这时候可以使用cursor的url属性引入需要的资源去替换原有样式

<div class="myCursor">自定义指针</div><br />


<style>
    .myCursor {
        cursor: url('@/assets/icons/cursor.svg'), pointer;
    }
</style>

需要注意的是，在自定义的光标yang后，定义一种普通的光标，以防没有由 URL 定义的可用光标。