Свойство cursor в CSS

Определение и использование

Свойство cursor определяет тип курсора (форму), который нужно отображать.

Эта属性 определяет形状 курсора, который используется, когда указатель мыши находится в пределах границ элемента (хотя CSS2.1 не определяет, какие границы определяют этот диапазон).

См. также:

Уроки CSSПозиционирование CSS

Руководство по HTML DOMАтрибут cursor

Пример

Некоторые разные курсоры:

span.crosshair {cursor:crosshair;}
span.help {cursor:help;}
span.wait {cursor:wait;}

Попробуйте сами

Синтаксис CSS

cursor: value;

Значение атрибута

Значение Описание
url

URL, который нужно использовать для пользовательского курсора.

Комментарий:Всегда определяйте один стандартный курсор в конце этого списка, чтобы избежать использования недоступного курсора, определенного URL.
default Standartный курсор (обычно это стрелка)
auto По умолчанию. Курсор, установленный браузером.
crosshair Курсор呈现为十字线.
pointer Курсор呈现在链接 указателем (рука).
move Этот курсор указывает на то, что объект можно переместить.
e-resize Этот курсор указывает на то, что край прямоугольника можно сдвинуть вправо (восток).
ne-resize Этот курсор указывает на то, что край прямоугольника можно сдвинуть вверх и вправо (север/восток).
nw-resize Этот курсор указывает на то, что край прямоугольника можно сдвинуть вверх и влево (север/запад).
n-resize Этот курсор указывает на то, что край прямоугольника можно сдвинуть вверх (север).
se-resize Этот курсор указывает на то, что край прямоугольника можно сдвинуть вниз и вправо (юг/восток).
sw-resize Этот курсор указывает на то, что край прямоугольника можно сдвинуть вниз и влево (юг/запад).
s-resize Этот курсор указывает на то, что край прямоугольника можно сдвинуть вниз (юг).
w-resize Этот курсор указывает на то, что край прямоугольника можно сдвинуть влево (запад).
text Этот курсор указывает на текст.
wait Этот курсор указывает на то, что программа загружена (обычно это часы или песочные часы).
help Этот курсор указывает на доступную помощь (обычно это вопросительный знак или мыльница).

Технические детали

Значение по умолчанию: auto
Ингеритация: да
Версия: CSS2
JavaScript синтаксис: object.style.cursor="crosshair"

Пример TIY

Изменение курсора
Этот пример демонстрирует, как изменить курсор.

Поддержка браузерами

Числа в таблице указывают на первую версию браузера, которая полностью поддерживает этот атрибут.

Chrome IE / Edge Firefox Safari Opera
5.0 5.5 4.0 5.0 9.6

Комментарий:Opera 9.3 и Safari 3 не поддерживают url значение.