English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
L'attributo CSS cursor specifica il tipo di cursore visualizzato quando il puntatore viene posizionato su un elemento.
La tabella seguente fornisce una descrizione dell'uso e la cronologia delle versioni di questa proprietà, nonché la sintassi dell'uso di questa proprietà nei script JavaScript.
| Valore predefinito: | auto |
|---|---|
| Applicabile a: | Tutti gli elementi |
| Ereditarietà: | Sì |
| Animabile: | No.Si prega di consultare Proprietà animazione. |
| Versione: | CSS 2, 3 |
| Sintassi JavaScript: | JavaScript: object.style.cursor="context-menu" |
La sintassi di questa proprietà è la seguente:
cursor: [url(indirizzo del file del cursore),] 0 o più volte | auto | predefinito | none | context-menu | help | pointer | progress | wait | cell | crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | grab | grabbing | e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize | sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll | zoom-in | zoom-out | initial | inherit
gli esempi seguenti mostrano come utilizzare l'attributo cursor.
h1 {
cursor: copy;
}
p {
cursor: help;
}
a {
cursor: url("custom.gif"), url("custom.cur"), default;
}testa e vedi‹/›l'attributo cursor viene utilizzato per specificare una lista di valori di cursori definiti dall'utente, separati da virgola, seguiti dal "cursore generico". Ossia, se il primo cursore specificato non è corretto o non trovato, verrà utilizzato il prossimo cursore nella lista, e così via, fino a trovare un cursore disponibile.
se non ci sono cursori definiti dall'utente validi o supportati dal browser, verrà utilizzato il cursore generico alla fine della lista.impara di più.
la tabella seguente descrive i valori di questo attributo.
| valore | vedi | descrizione |
|---|---|---|
| comune | ||
| auto | il browser determina il cursore da visualizzare in base al contesto attuale. Ad esempio, hover del testo sul testo. Questo è il valore predefinito. | |
| default | cursore predefinito del sistema, indipendentemente dal contesto, di solito una freccia. | |
| none | nessun cursore visualizzato. | |
| initial | imposta questo attributo al suo valore predefinito. | |
| inherit | se specificato, l'elemento correlato adotta il valore dell'attributo cursor dell'elemento padre. | |
| link e cursore di stato | ||
| context-menu | indicazione che il menu contestuale è disponibile. | |
| help | indicazione di aiuto. | |
| pointer | indicatore di link, di solito una mano con il dito medio allungato. | |
| progress | indicatore di progresso. Questo programma sta eseguendo alcune elaborazioni, ma l'utente può ancora interagire con l'interfaccia (con diversi wait). | |
| wait | 表示程序忙，用户应该等待。 | |
| Rappresenta che il programma è occupato e l'utente dovrebbe aspettare. | ||
| Cursor di selezione | Rappresenta la possibilità di selezionare una cella (o un gruppo di celle). | |
| crosshair | Un semplice mirino. Di solito usato per indicare la selezione in un bitmap. | |
| text | Rappresenta il testo selezionabile, di solito il trave orizzontale. | |
| vertical-text | Rappresenta la possibilità di selezionare il testo verticale, ovvero il trave orizzontale. | |
| Cursor di trascinamento e rilascio | ||
| alias | Rappresenta la creazione di un alias o di un collegamento. | |
| copy | Rappresenta la possibilità di copiare alcuni contenuti. | |
| move | Rappresenta la possibilità di muovere l'oggetto hover. | |
| no-drop | Rappresenta che l'oggetto trascinato non può essere posizionato nella posizione corrente. | |
| not-allowed | Rappresenta l'impossibilità di completare qualcosa. | |
| Cursor di ridimensionamento e scorrimento | ||
| all-scroll | Rappresenta la possibilità di scorrere in qualsiasi direzione (traslazione). | |
| col-resize | Indica che è possibile aggiustare la dimensione orizzontale di una colonna. | |
| row-resize | Indica che è possibile aggiustare la dimensione verticale di una riga. | |
| n-resize | Indica che alcuni margini devono muoversi verso l'alto (a nord). | |
| e-resize | Indica che alcuni margini devono muoversi a destra (a est). | |
| s-resize | Indica che alcuni margini devono muoversi verso il basso (a sud). | |
| w-resize | Indica che alcuni margini devono muoversi a sinistra (verso ovest). | |
| ne-resize | Indica che alcuni margini devono muoversi verso l'alto e a destra (nord/est). | |
| nw-resize | Indica che alcuni margini devono muoversi in su e in giù (nord/ovest). | |
| se-resize | Indica che alcuni margini devono muoversi a sinistra e a destra (a sud/est). | |
| sw-resize | Indica che alcuni margini devono muoversi in su e in giù (sud/ovest). | |
| ew-resize | Indica un cursore di ridimensionamento bidirezionale. | |
| ns-resize | ||
| nesw-resize | ||
| nwse-resize | ||
| Cursor di zoom | ||
| zoom-in | Rappresenta qualcosa che può essere ingrandito. | |
| zoom-out | Rappresenta qualcosa che può essere ristretto. | |
| grab | Rappresenta qualcosa che può essere catturato (trascinato per muoversi). | |
| grabbing | Rappresenta qualcosa che è stato catturato. | |
Compatibilità del browser per la proprietà cursor, i numeri nella tabella sottostante rappresentano la versione minima del browser che supporta questa proprietà; tutti i browser mainstream supportano questa proprietà.
|
Vedere la guida:Cursor CSS.