English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Atributo de cursor CSS, usado para definir o tipo de cursor (ou ponteiro do mouse) ao passar o mouse em uma área ou link na página da web.
Os navegadores geralmente exibem o ponteiro do mouse em qualquer parte em branco da página da web, a mão com luva em qualquer link ou item clicável, e o cursor de edição em qualquer texto ou campo de texto. Com CSS, você pode redefine essas propriedades para exibir diferentes tipos de cursor.
h1 {
cursor: mover;
}
p {
cursor: texto;
}Teste e veja‹/›A seguir, demonstra a maioria dos navegadores que aceitam diferentes cursor. Coloque o ponteiro do mouse no link "TEST" na coluna de saída para mostrar o cursor.
| Ver | valor | Exemplo | Ver |
|---|---|---|---|
| padrão | a:hover{cursor:default;} | Teste | |
| ponteiro | a:hover{cursor:pointer;} | Teste | |
| texto | a:hover{cursor:text;} | Teste | |
| espera | a:hover{cursor:wait;} | Teste | |
| ajuda | a:hover{cursor:help;} | Teste | |
| progress | a:hover{cursor:progress;} | Teste | |
| crosshair | a:hover{cursor:crosshair;} | Teste | |
| move | a:hover{cursor:move;} | Teste | |
| url() | a:hover{cursor:url("custom.cur"), default;} | Teste |
Também pode ter um cursor completamente personalizado.
A propriedade cursor trata de uma lista separada por vírgulas de valores de cursor definidos pelo usuário, seguida porCursor ComumSe o primeiro cursor especificado estiver incorreto ou não puder ser encontrado, será usado o próximo cursor da lista separado por vírgula, e assim por diante, até encontrar um cursor disponível.
Se não houver cursor definido pelo usuário válido ou suportado pelo navegador, será usado o cursor comum no final da lista.
Dica:O formato padrão para o cursor é .cur. No entanto, você pode usar software de conversão de imagem gratuito online para converter imagens como .jpg e .gif para .cur.
a {
cursor: url("custom.gif"), url("custom.cur"), default;
}Teste e veja‹/›No exemplo acima, custom.gif e custom.cur são arquivos de cursor personalizado, carregados no seu espaço de servidor, e default é o cursor comum. Se o cursor personalizado desaparecer ou o navegador do visualizador não suportá-lo, o cursor comum será usado.
Aviso:Para declarar um cursor personalizado, é necessário definir um no final da listaCursor ComumCaso contrário, o cursor personalizado não será exibido corretamente.
Esta é uma demonstração ao vivo do cursor personalizado.
Atenção: IE9E versões mais antigas suportam apenas valores de URL estáticos de cursor .cur e animações de cursor .ani. No entanto, navegadores como Firefox, Chrome e Safari suportam .cur, .png, .gif e .jpg, mas não .ani.