    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="UTF-8">
      <title>커서 모양 바꾸기</title>
      <style>
        p {
          background-color: #ffffef;
          border: 1px solid #ffbf69;
          text-align: center;
        }
      </style>
    </head>
    <body>
      박스에 마우스를 올리면 커서 모양이 변경됨
      <p style="cursor: help">cursor: help</p>
      <p style="cursor: pointer">cursor: pointer</p>
      <p style="cursor: progress">cursor: progress</p>
      <p style="cursor: wait">cursor: wait</p>
      <p style="cursor: crosshair">cursor: crosshair</p>
      <p style="cursor: text">cursor: text</p>
      <p style="cursor: vertical-text">cursor: vertical-text</p>
      <p style="cursor: copy">cursor: copy</p>
      <p style="cursor: move">cursor: move</p>
      <p style="cursor: not-allowed">cursor: not-allowed</p>
      <p style="cursor: grab">cursor: grab</p>
      <p style="cursor: grabbing">cursor: grabbing</p>
      <p style="cursor: zoom-in">cursor: zoom-in</p>
      <p style="cursor: zoom-out">cursor: zoom-out</p>
    </body>
    </html>