From c9cc4d332a063ca381e8a22dfc33a591dd6f2bb5 Mon Sep 17 00:00:00 2001 From: Ninjirate <44177938+Ninjirate@users.noreply.github.com> Date: Mon, 15 Oct 2018 23:48:55 -0500 Subject: [PATCH] Sort and Add Missing (#19375) Sorted list of cursors and added missing types, updated total count from 36 to 39. Added note about using auto (default) with URL cursor in case file is unavailable on page load. --- .../guide/english/css/css-cursors/index.md | 62 ++++++++++--------- 1 file changed, 34 insertions(+), 28 deletions(-) diff --git a/client/src/pages/guide/english/css/css-cursors/index.md b/client/src/pages/guide/english/css/css-cursors/index.md index 87becff213..d4aa5821f7 100644 --- a/client/src/pages/guide/english/css/css-cursors/index.md +++ b/client/src/pages/guide/english/css/css-cursors/index.md @@ -3,49 +3,55 @@ title: CSS Cursors --- ## CSS Cursors -The cursor property specifies the type of cursor to be displayed when you hover over an element. It has 36 possible values: +The cursor property specifies the type of cursor to be displayed when you hover over an element. It has 39 possible values: ```css + .alias { cursor: alias; } + .all-scroll { cursor: all-scroll; } .auto { cursor: auto; } - .default { cursor: default; } - .none { cursor: none; } + .cell { cursor: cell; } .context-menu { cursor: context-menu; } + .col-resize { cursor: col-resize; } + .copy { cursor: copy; } + .crosshair { cursor: crosshair; } + .default { cursor: default; } + .e-resize { cursor: e-resize; } + .ew-resize { cursor: ew-resize; } + .grab { cursor: grab; } + .grabbing { cursor: grabbing; } .help { cursor: help; } + .move { cursor: move; } + .n-resize { cursor: n-resize; } + .ne-resize { cursor: ne-resize; } + .nesw-resize { cursor: nesw-resize; } + .ns-resize { cursor: ns-resize; } + .nw-resize { cursor: nw-resize; } + .nwse-resize { cursor: nwse-resize; } + .no-drop { cursor: no-drop; } + .none { cursor: none; } + .not-allowed { cursor: not-allowed; } .pointer { cursor: pointer; } .progress { cursor: progress; } - .wait { cursor: wait; } - .cell { cursor: cell; } - .crosshair { cursor: crosshair; } - .text { cursor: text; } - .vertical-text { cursor: vertical-text; } - .alias { cursor: alias; } - .copy { cursor: copy; } - .move { cursor: move; } - .no-drop { cursor: no-drop; } - .not-allowed { cursor: not-allowed; } - .all-scroll { cursor: all-scroll; } - .col-resize { cursor: col-resize; } .row-resize { cursor: row-resize; } - .n-resize { cursor: n-resize; } - .e-resize { cursor: e-resize; } .s-resize { cursor: s-resize; } - .w-resize { cursor: w-resize; } - .ns-resize { cursor: ns-resize; } - .ew-resize { cursor: ew-resize; } - .ne-resize { cursor: ne-resize; } - .nw-resize { cursor: nw-resize; } .se-resize { cursor: se-resize; } .sw-resize { cursor: sw-resize; } - .nesw-resize { cursor: nesw-resize; } - .nwse-resize { cursor: nwse-resize; } -``` + .text { cursor: text; } + .vertical-text { cursor: vertical-text; } + .w-resize { cursor: w-resize; } + .wait { cursor: wait; } + .zoom-in { cursor: zoom-in; } + .zoom-out { cursor: zoom-out; } + .initial { cursor: initial; } + .inherit { cursor: inherit; } + ``` ![alt text](http://www.javascripter.net/faq/24_cursor_styles.gif "CSS Cursors") - -You can also set an image as the cursor. +You can also set an image as the cursor. +Note: Always specific a default cursor at the end incase the specified cursor is unavailable. ``` .custom-cursor { - cursor: url(cursor-image.png); + cursor: url(cursor-image.png),auto; } ```