СSS Свойство cursor
Пример
CSS может генерировать кучу различных курсоров мыши:
.alias {cursor: alias;}
.all-scroll {cursor: all-scroll;}
.auto
{cursor: auto;}
.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;}
.row-resize {cursor: row-resize;}
.s-resize {cursor:
s-resize;}
.se-resize {cursor: se-resize;}
.sw-resize {cursor: sw-resize;}
.text {cursor: text;}
.url {cursor: url(myBall.cur),auto;}
.w-resize
{cursor: w-resize;}
.wait {cursor: wait;}
.zoom-in {cursor: zoom-in;}
.zoom-out {cursor: zoom-out;}
Попробуйте сами »
Определение и использование
Свойство cursor
указывает курсор мыши, который будет отображаться при наведении на элемент.
Значение по умолчанию: | auto |
---|---|
Унаследованный: | да |
Анимируемый: | нет. Прочитать о animatable |
Версия: | CSS2 |
JavaScript синтаксис: | object.style.cursor="crosshair" Попробовать |
Поддержка браузеров
Числа в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
Свойство | |||||
---|---|---|---|---|---|
cursor | 5.0 | 5.5 | 4.0 | 5.0 | 9.6 |
CSS Синтаксис
cursor: value;
Значения свойств
Значение | Описание | Воспроизвести |
---|---|---|
alias | Курсор указывает на псевдоним чего-то, что должно быть создано | Воспроизвести » |
all-scroll | Курсор указывает, что что-то можно прокрутить в любом направлении | Воспроизвести » |
auto | По умолчанию. Браузер устанавливает курсор | Воспроизвести » |
cell | Курсор указывает, что ячейка (или набор ячеек) может быть выбрана | Воспроизвести » |
context-menu | Курсор указывает, что контекстное меню доступно | Воспроизвести » |
col-resize | Курсор указывает, что размер столбца можно изменить по горизонтали | Воспроизвести » |
copy | Курсор указывает, что что-то должно быть скопировано | Воспроизвести » |
crosshair | Курсор отображается в виде перекрестия | Воспроизвести » |
default | Курсор по умолчанию | Воспроизвести » |
e-resize | Курсор указывает, что край коробки должен быть перемещен вправо (на восток) | Воспроизвести » |
ew-resize | Указывает двунаправленный курсор изменения размера | Воспроизвести » |
grab | Курсор указывает, что что-то можно схватить | Воспроизвести » |
grabbing | Курсор указывает, что что-то можно схватить | Воспроизвести » |
help | Курсор указывает, что справка доступна | Воспроизвести » |
move | Курсор указывает, что что-то должно быть перемещено | Воспроизвести » |
n-resize | Курсор указывает, что край коробки должен быть перемещен вверх (на север) | Воспроизвести » |
ne-resize | Курсор указывает, что край коробки должен быть перемещен вверх и вправо (север/восток) | Воспроизвести » |
nesw-resize | Указывает двунаправленный курсор изменения размера | Воспроизвести » |
ns-resize | Указывает двунаправленный курсор изменения размера | Воспроизвести » |
nw-resize | Курсор указывает, что край коробки должен быть перемещен вверх и влево (север/запад) | Воспроизвести » |
nwse-resize | Указывает двунаправленный курсор изменения размера | Воспроизвести » |
no-drop | Курсор указывает, что перетаскиваемый элемент не может быть отброшен сюда | Воспроизвести » |
none | Курсор не отображается для элемента | Воспроизвести » |
not-allowed | Курсор указывает, что запрошенное действие не будет выполнено | Воспроизвести » |
pointer | Курсор является указателем и указывает на ссылку | Воспроизвести » |
progress | Курсор указывает, что программа занята (выполняется) | Воспроизвести » |
row-resize | Курсор указывает, что размер строки можно изменить по вертикали | Воспроизвести » |
s-resize | Курсор указывает, что край коробки должен быть перемещен вниз (на юг) | Воспроизвести » |
se-resize | Курсор указывает, что край коробки должен быть перемещен вниз и вправо (юг/восток) | Воспроизвести » |
sw-resize | Курсор указывает, что край коробки должен быть перемещен вниз и влево (юг/запад) | Воспроизвести » |
text | Курсор указывает на текст, который может быть выделен | Воспроизвести » |
URL | Разделенный запятыми список URL-адресов пользовательских курсоров. Примечание: Всегда указывайте общий курсор в конце списка, если ни один из определенных URL курсоров не может быть использован | Воспроизвести » |
vertical-text | Курсор указывает на вертикальный текст, который может быть выбран | Воспроизвести » |
w-resize | Курсор указывает, что край коробки должен быть перемещен влево (на запад) | Воспроизвести » |
wait | Курсор указывает, что программа занята | Воспроизвести » |
zoom-in | Курсор указывает, что что-то можно увеличит | Воспроизвести » |
zoom-out | Курсор указывает, что что-то можно уменьшить | Воспроизвести » |
initial | Устанавливает для этого свойства значение по умолчанию. Прочитать о initial | Воспроизвести » |
inherit | Наследует это свойство от родительского элемента. Прочитать о inherit |
Связанные страницы
HTML DOM Справочник: Свойство cursor