Style 對象
定義和用法
cursor 屬性設定或傳回滑鼠指針顯示的光标類型。
文法
設定 cursor 屬性：
Object.style.cursor="value"
傳回 cursor 屬性：
Object.style.cursor
| 值 | 描述 |
|---|---|
| auto | 預設。浏覽器設定的光标（通常是一個箭頭）。 |
| crosshair | 光标呈現為十字線。 |
| default | 預設光标（通常是一個箭頭）。 |
| e-resize | 向右（東）的箭頭，訓示元素是可變尺寸的，矩形框的邊緣可被向右（東）移動。 |
| help | 帶有問号的箭頭，訓示可用的幫助。 |
| move | 交叉箭頭，訓示某對象可被移動。 |
| n-resize | 向上（北）的箭頭，訓示元素是可變尺寸的，矩形框的邊緣可被向上（北）移動。 |
| ne-resize | 東北方向的箭頭，訓示元素是可變尺寸的，矩形框的邊緣可被向上及向右移動（北/東）。 |
| nw-resize | 西北方向的箭頭，訓示元素是可變尺寸的，矩形框的邊緣可被向上及向左移動（北/西）。 |
| pointer | 光标呈現為訓示連結的指針（一隻手）。 |
| s-resize | 向下（南）的箭頭，訓示元素是可變尺寸的，矩形框的邊緣可被向下（南）移動。 |
| se-resize | 東南方向的箭頭，訓示元素是可變尺寸的，矩形框的邊緣可被向下及向右移動（南/東）。 |
| sw-resize | 西南方向的箭頭，訓示元素是可變尺寸的，矩形框的邊緣可被向下及向左移動（南/西）。 |
| text | 此光标訓示文本。 |
| url | 需被使用的自定義光标的 URL。 提示： 請在此清單的末端始終定義一種普通的光标，以防沒有由 URL 定義的可用光标。 |
| w-resize | 向左（西）的箭頭，訓示元素是可變尺寸的，矩形框的邊緣可被向左（西）移動。 |
| wait | 此光标訓示程式正忙（通常是一隻表或沙漏）。 |
浏覽器支援
所有主要浏覽器都支援 cursor 屬性。
執行個體
更改光标：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥教程(runoob.com)</title>
<script>
function displayResult(){
document.getElementById("p1").style.cursor="pointer";
}
</script>
</head>
<body>
<p id="p1">滑鼠經過這個文本。</p>
<br>
<button type="button" onclick="displayResult()">修改光标類型</button>
</body>
</html>
更多執行個體
更多光标
顯示所有可用的光标。
Style 對象