Accueil > Programmation > Html Css Javascript... > html : curseur

html : curseur

Publié le 19 août 2017, dernière mise-à-jour le 9 janvier 2023, 6 visites, 23646 visites totales.

https://www.w3schools.com/csSref/pr_class_cursor.asp

taille max de l’image : 128x128 voire 32x32

<style type="text/css">
.curseur_normal{cursor:default;}
.curseur_auto{cursor:auto;}
.curseur_croix{cursor:crosshair;}
.curseur_aide{cursor:help;}
.curseur_move{cursor:move;}
.curseur_texte{cursor:text;}
.curseur_attente{cursor:wait;}
.curseur_pointer{cursor:pointer;}
.curseur_img{cursor:url('aa.png'), pointer;}
.curseur_n{cursor:n-resize;}
.curseur_s{cursor:s-resize;}
.curseur_e{cursor:e-resize;}
.curseur_w{cursor:w-resize;}
.curseur_ne{cursor:ne-resize;}
.curseur_nw{cursor:nw-resize;}
.curseur_se{cursor:se-resize;}
.curseur_sw{cursor:sw-resize;}
</style>
<h1>G&eacute;n&eacute;ral</h1>
<span class="curseur_normal"><strong>Curseur normal:</strong> cursor:default;</span><br />
<span class="curseur_auto"><strong>Curseur automatique:</strong> cursor:auto;</span><br />
<span class="curseur_croix"><strong>Curseur croix:</strong> cursor:crosshair;</span><br />
<span class="curseur_aide"><strong>Curseur aide:</strong> cursor:help;</span><br />
<span class="curseur_move"><strong>Curseur d&eacute;placement:</strong> cursor:move;</span><br />
<span class="curseur_pointer"><strong>Curseur main(pointeur):</strong> cursor:pointer;</span><br />
<span class="curseur_texte"><strong>Curseur texte:</strong> cursor:text;</span><br />
<span class="curseur_attente"><strong>Curseur attente(sablier):</strong> cursor:wait;</span><br />
<span class="curseur_img"><strong>Curseur image:</strong> cursor:url('adresse_de_limage'), default;</span>
<h1>Redimention</h1>
<span class="curseur_n"><strong>Curseur redimetion nord(haut):</strong> cursor:n-resize;</span><br />
<span class="curseur_s"><strong>Curseur redimetion sud(bas):</strong> cursor:s-resize;</span><br />
<span class="curseur_e"><strong>Curseur redimetion est(droite):</strong> cursor:e-resize;</span><br />
<span class="curseur_w"><strong>Curseur redimetion ouest(gauche):</strong> cursor:w-resize;</span><br />
<span class="curseur_ne"><strong>Curseur redimetion nord est(haut droite):</strong> cursor:ne-resize;</span><br />
<span class="curseur_nw"><strong>Curseur redimetion nord ouest(haut gauche):</strong> cursor:nw-resize;</span><br />
<span class="curseur_se"><strong>Curseur redimetion sud est(bas droite):</strong> cursor:se-resize;</span><br />
<span class="curseur_sw"><strong>Curseur redimetion sud ouest(bas gauche):</strong> cursor:sw-resize;</span><br />

Value	Description
alias	The cursor indicates an alias of something is to be created
all-scroll	The cursor indicates that something can be scrolled in any direction
auto	Default. The browser sets a cursor
cell	The cursor indicates that a cell (or set of cells) may be selected
context-menu	The cursor indicates that a context-menu is available
col-resize	The cursor indicates that the column can be resized horizontally
copy	The cursor indicates something is to be copied
crosshair	The cursor render as a crosshair
default	The default cursor
e-resize	The cursor indicates that an edge of a box is to be moved right (east)
ew-resize	Indicates a bidirectional resize cursor
grab	The cursor indicates that something can be grabbed
grabbing	The cursor indicates that something can be grabbed
help	The cursor indicates that help is available
move	The cursor indicates something is to be moved
n-resize	The cursor indicates that an edge of a box is to be moved up (north)
ne-resize	The cursor indicates that an edge of a box is to be moved up and right (north/east)
nesw-resize	Indicates a bidirectional resize cursor
ns-resize	Indicates a bidirectional resize cursor
nw-resize	The cursor indicates that an edge of a box is to be moved up and left (north/west)
nwse-resize	Indicates a bidirectional resize cursor
no-drop	The cursor indicates that the dragged item cannot be dropped here
none	No cursor is rendered for the element
not-allowed	The cursor indicates that the requested action will not be executed
pointer	The cursor is a pointer and indicates a link
progress	The cursor indicates that the program is busy (in progress)
row-resize	The cursor indicates that the row can be resized vertically
s-resize	The cursor indicates that an edge of a box is to be moved down (south)
se-resize	The cursor indicates that an edge of a box is to be moved down and right (south/east)
sw-resize	The cursor indicates that an edge of a box is to be moved down and left (south/west)
text	The cursor indicates text that may be selected
URL	A comma separated list of URLs to custom cursors. Note : Always specify a generic cursor at the end of the list, in case none of the URL-defined cursors can be used
vertical-text	The cursor indicates vertical-text that may be selected
w-resize	The cursor indicates that an edge of a box is to be moved left (west)
wait	The cursor indicates that the program is busy
zoom-in	The cursor indicates that something can be zoomed in
zoom-out	The cursor indicates that something can be zoomed out
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

[bruno sanchiz]

html : curseur

Derniers articles modifiés

Programmation

Dans la même rubrique

Mots-clés