cursor
======

Sumário
-------

A propriedade CSS **cursor** especifica o cursor do mouse mostrado quando o ponteiro do mouse está sobre um elemento.

Experimente
-----------

Sintaxe
-------


```css
/\* Keywords \*/
cursor: pointer;
cursor: auto;

/\* Usando URL e cordenadas \*/
cursor:
  url(cursor1.png) 4 12,
  auto;
cursor:
  url(cursor2.png) 2 2,
  pointer;

/\* Valores globais \*/
cursor: inherit;
cursor: initial;
cursor: unset;
```

### Valores

`<uri>` 
Experimental

Uma url(...) ou uma lista de url(...) separada por vírgula, apontando para uma arquivo de imagem. Mais que uma `<uri>()` (en-US) pode ser fornecida como fallback, em caso de alguns tipos de imagem não ser suportado. Um fallback não-URL (um ou mais dos outros valores) **deve** estar no final da lista de fallbacks.

`<x>` `<y>` 
Experimental

Coordenadas x e y opcionais. Dois números não-negativos, sem unidade e menores que 32.

`Keyword`

**Mova o mouse sobre os valores para testar:**

| Categoria | Valor CSS | Actual | Descrição |
| --- | --- | --- | --- |
| General | `auto` |  | O brower determina o cursor para ser exibido baseado no contexto atual. |
| `default` | default.gif | Cursor padrão, tipicamente uma seta. |
| `none` |  | Nenhum cursor é mostrado. |
| Links & status | `context-menu` | context-menu.png | 
 Um menu de contexto está disponível sob o cursor.Somente IE 10 e
 superior implementou esta propriedade no Windows:
 [Erro do Firefox 258960](https://bugzil.la/258960).
  |
| `help` | help.gif | Indicando que ajuda está disponível. |
| `pointer` | pointer.gif | E.g. Usado quando pairando o cursor sobre links, tipicamente uma mão. |
| `progress` | progress.gif | 
 O programa está processando em segundo plano, mas o o usuário ainda pode
 interagir com a interface (diferente de `wait`).
  |
| `wait` | wait.gif | O programa está ocupado (às vezes uma ampulheta ou relógio). |
| Seleção | `cell` | cell.gif | Indica que a célula pode ser selecionada. |
| `crosshair` | crosshair.gif | 
 Cursor de cruz, normalmente usado para indicar seleção em uma imagem
 bitmap.
  |
| `text` | text.gif | Indica que o texto pode ser selecionado, normalmente um I maiúsculo. |
| `vertical-text` | vertical-text.gif | 
 Indica que o texto vertical pode ser selecionado, normalmente um I
 maiúsculo virado de lado.
  |
| Arrastar e soltar | `alias` | alias.gif | Indicando que um alias ou atalho deve ser criado. |
| `copy` | copy.gif | Indica que algo será copiado. |
| `move` | move.gif | O item sob o mouse pode ser movido. |
| `no-drop` | no-drop.gif | 
 Cursor mostrando que não é permitido largar um elemento no local
 atual.[Erro do Firefox 275173](https://bugzil.la/275173)no Windows e no Mac OS X, "sem
 soltar é o mesmo que não permitido".
  |
| `not-allowed` | not-allowed.gif | Cursor mostrando que uma ação não pode ser efetuada. |
| Resize & scrolling | `all-scroll` | all-scroll.gif | 
 Cursor showing that something can be scrolled in any direction
 (panned).[Erro do Firefox 275174](https://bugzil.la/275174) on Windows, "*all-scroll*
 is the same as *move*".
  |
| `col-resize` | col-resize.gif | 
 The item/column can be resized horizontally. Often rendered as arrows
 pointing left and right with a vertical bar separating.
  |
| `row-resize` | row-resize.gif | 
 The item/row can be resized vertically. Often rendered as arrows
 pointing up and down with a horizontal bar separating them.
  |
| `n-resize` | Example of a resize towards the top cursor | 
 Some edge is to be moved. For example, the `se-resize` cursor
 is used when the movement starts from the *south-east* corner of
 the box.
  |
| `e-resize` | Example of a resize towards the right cursor |
| `s-resize` | Example of a resize towards the bottom cursor  |
| `w-resize` | Example of a resize towards the left cursor |
| `ne-resize` | Example of a resize towards the top-right corner cursor |
| `nw-resize` | Example of a resize towards the top-left corner cursor |
| `se-resize` | Example of a resize towards the bottom-right corner cursor |
| `sw-resize` | Example of a resize towards the bottom-left corner cursor |
| `ew-resize` | 3-resize.gif | Indicates a bidirectional resize cursor. |
| `ns-resize` | 6-resize.gif |
| `nesw-resize` | 1-resize.gif |
| `nwse-resize` | 4-resize.gif |
| Zoom | `zoom-in` | zoom-in.gif | Indicates that something can be zoomed (magnified) in or out. |
| `zoom-out` | zoom-out.gif |
| Grab | `grab` | grab.gif | Indicates that something can be grabbed (dragged to be moved). |
| `grabbing` | grabbing.gif |

### Sintaxe formal
```

cursor =   
  [ (en-US) [ (en-US) <url> | (en-US) <url-set> ] (en-US) [ (en-US) <x> <y> ] (en-US)? (en-US) ] (en-US)# (en-US)? (en-US) [ (en-US) auto | (en-US) default | (en-US) none | (en-US) context-menu | (en-US) help | (en-US) pointer | (en-US) progress | (en-US) wait | (en-US) cell | (en-US) crosshair | (en-US) text | (en-US) vertical-text | (en-US) alias | (en-US) copy | (en-US) move | (en-US) no-drop | (en-US) not-allowed | (en-US) grab | (en-US) grabbing | (en-US) e-resize | (en-US) n-resize | (en-US) ne-resize | (en-US) nw-resize | (en-US) s-resize | (en-US) se-resize | (en-US) sw-resize | (en-US) w-resize | (en-US) ew-resize | (en-US) ns-resize | (en-US) nesw-resize | (en-US) nwse-resize | (en-US) col-resize | (en-US) row-resize | (en-US) all-scroll | (en-US) zoom-in | (en-US) zoom-out ] (en-US)    
  
<url> =   
  <url()>  | (en-US)  
  <src()>    
  
<x> =   
  x    
  
<y> =   
  y    
  
<url()> =   
  url( <string> (en-US) <url-modifier>\* (en-US) )  | (en-US)  
  <url-token>                        
  
<src()> =   
  src( <string> (en-US) <url-modifier>\* (en-US) )    
  
```

Exemplos
--------


```css
.foo {
  cursor: crosshair;
}

/\* use velor prefixado se "zoom-in" não for suportado \*/
.bar {
  cursor: -webkit-zoom-in;
  cursor: zoom-in;
}

/\* valor padrão como fallback para url() deve ser fornecido (não funciona sem) \*/
.baz {
  cursor: url(hyper.cur), auto;
}
```

Especificações
--------------

| Specification |
| --- |
| CSS Basic User Interface Module Level 4 # cursor |

Definição formal
----------------

|  |  |
| --- | --- |
| Initial value | `auto` |
| Aplica-se a | all elements |
| Inherited | yes |
| Computed value | as specified, but with `url` (en-US) values made absolute |
| Animation type | discrete |

Compatibilidade
---------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Veja também
-----------

* `<uri>()` (en-US)
* `pointer-events`