CSS свойство cursor

Определяет вид курсора при наведении мышки на элемент. Вид курсора зависит от операционной системы и установленных параметров.

CSS синтаксис

cursor: значение;

Возможные значения

Значение Описание
auto Значение по умолчанию. Форму курсора определяет браузер.
crosshair Курсор в виде большого знака "+". crosshair
default Системный курсор. default
help Курсор, показывающий наличие справочной информации. help
move Используется для указания чего-то, что может быть перемещено. move
n-resize Используется для указания чего-то, чей размер может быть растянут вверх. n-resize
ne-resize Используется для указания чего-то, чей размер может быть растянут вверх и вправо. ne-resize
e-resize Используется для указания чего-то, чей размер может быть растянут вправо. e-resize
se-resize Используется для указания чего-то, чей размер может быть растянут вниз и вправо. se-resize
s-resize Используется для указания чего-то, чей размер может быть растянут вниз. s-resize
sw-resize Используется для указания чего-то, чей размер может быть растянут вниз и влево. sw-resize
w-resize Используется для указания чего-то, чей размер может быть растянут влево. w-resize
nw-resize Используется для указания чего-то, чей размер может быть растянут вверх и влево. nw-resize
text Текстовый курсор. text
pointer Курсор-указатель. pointer
progress Курсор-ожидание, показывающий, что программа работает, но процесс может быть прерван. progress
wait Курсор-ожидание, показывающий, что следует дождаться окончания работы программы. wait
URL Список разделенных запятыми URLов к пользовательским курсорам. Указывается путь к файлу курсора, который должен быть в формате CUR или ANI. В конце списка всегда следует указывать какой-нибудь базовый курсор на случай, если пользовательские курсоры будут недоступны.
initial Устанавливает значение по умолчанию.
inherit Значение наследуется от родительского элемента.

Пример

Устанавливаем разные виды курсора


span.crosshair {
    cursor: crosshair;
}

 span.help {
    cursor: help;
}

 span.wait {
    cursor: wait;
}