CSS中的cursor屬性(游標樣式)

來源:互聯網
上載者:User

把你的游標放到相應文字上查看效果

要注意游標的實際效果依賴於使用者的系統設定,與你在這裡看到的效果並不一定一致。

cursor: crosshair;

十字准心

The cursor render as a crosshair
遊標表現為十字準線

cursor: pointer;
cursor: hand;
寫兩個是為了照顧IE5,它只認hand。

The cursor render as a pointer (a hand) that indicates a link
遊標以暗示(手指)的形式來表明有一個串連

cursor: wait;

等待/沙漏

The cursor indicates that the program is busy (often a watch or an hourglass)
遊標暗示當前程式正忙(一般為一塊表或是一個沙漏)

cursor: help;

協助

The cursor indicates that help is available (often a question mark or a balloon)
遊標暗示當前位置可得到協助(一般為問號或是氣球)

cursor: no-drop;

無法釋放

cursor: no-drop;

cursor: text;

文字/編輯

The cursor indicates text
遊標暗示當前所處位置為文字內容

cursor: move;

可移動對象

The cursor indicates something that should be moved
遊標暗示一些東西應該被移動

cursor: n-resize;

 

向上改變大小(North)

The cursor indicates that an edge of a box is to be moved up (north)
邊緣可向上移動(北)

cursor: s-resize;

向下改變大小(South)

The cursor indicates that an edge of a box is to be moved down (south)
邊緣可向下方移動(南)

cursor: e-resize;

向右改變大小(East)

The cursor indicates that an edge of a box is to be moved right (east)
box邊緣可向右(東)邊移動

cursor: w-resize;

向左改變大小(West)

The cursor indicates that an edge of a box is to be moved left (west)
邊緣可向左移動(西)

cursor: ne-resize;

向上右改變大小(North East)

The cursor indicates that an edge of a box is to be moved up and right (north/east)
遊標暗示box的邊緣可向右上方移動(東北方向)

cursor: nw-resize;

向上左改變大小(North West)

The cursor indicates that an edge of a box is to be moved up and left (north/west)
邊緣可向左上方移動(西北)

cursor: se-resize;

向下右改變大小(South East)

The cursor indicates that an edge of a box is to be moved down and right (south/east)
邊緣可向右下方移動(東南)

cursor: sw-resize;

向下左改變大小(South West)

The cursor indicates that an edge of a box is to be moved down and left (south/west)
邊緣可向左下方移動(西南)

cursor: auto;

 

自動

The browser sets a cursor
瀏覽器設定一個遊標

cursor:not-allowed;

禁止

cursor:not-allowed;

cursor: progress;

處理中

cursor: progress;

cursor: default;

系統預設

The default cursor (often an arrow)
預設的遊標狀態(通常為一個箭頭)

cursor: url(' # ');
# = 游標檔案地址      (注意檔案格式必須為:.cur 或 .ani)。

使用者自訂(可用動畫)

The url of a custom cursor to be used.
自訂遊標的url位置

Note: Always define a generic cursor at the end of the list in case none of the url-defined cursors can be used
注意:在定義完自訂的遊標之後在末尾加上一般性的遊標,以防那些url所定義的遊標不能使用

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.