blob: 152fe3b344693ef3653c34b78de60fb5217f4990 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
|
---
title: cursor
slug: Web/CSS/cursor
tags:
- Referencia_CSS
translation_of: Web/CSS/cursor
---
<p>{{ CSSRef() }}</p>
<h3 id="Resumo" name="Resumo">Resumo</h3>
<p>A propriedade {{ Cssxref("cursor") }} especifica o estilo do ponteiro do mouse quando estiver sobre o elemento.</p>
<ul>
<li>Valor inicial: <code>auto</code></li>
<li>Aplica-se a: todos os elementos</li>
<li>Herdado: sim</li>
<li>Porcentagens: N/A</li>
<li>Mídia: <a href="/pt/CSS/Media/Visual" title="pt/CSS/Media/Visual">Visual</a>, <a href="/pt/CSS/Media/Interactive" title="pt/CSS/Media/Interactive">Interactive</a></li>
<li><a href="/pt/CSS/computed_value" title="pt/CSS/computed_value">Valor computado</a>: como especificado (endereços relativos são convertidos como absolutos)</li>
</ul>
<h3 id="Sintaxe" name="Sintaxe">Sintaxe</h3>
<p><code>cursor:</code> [ {{ mediawiki.external(' ,') }}* {{ mediawiki.external(' <code>auto</code> | <code>crosshair</code> | <code>default</code> | <code>pointer</code> | <code>move</code> | <code>e-resize</code> | <code>ne-resize</code> | <code>nw-resize</code> | <code>n-resize</code> | <code>se-resize</code> | <code>sw-resize</code> | <code>s-resize</code> | <code>w-resize</code> | <code>text</code> | <code>wait</code> | <code>help</code> | <code>progress</code> | <code>copy</code> | <code>alias</code> | <code>context-menu</code> | <code>cell</code> | <code>not-allowed</code> | <code>col-resize</code> | <code>row-resize</code> | <code>no-drop</code> | <code>vertical-text</code> | <code>all-scroll</code> | <code>nesw-resize</code> | <code>nwse-resize</code> | <code>ns-resize</code> | <code>ew-resize</code> ') }} ] | {{ Cssxref("inherit") }}</p>
<h3 id="Valores" name="Valores">Valores</h3>
<dl>
<dt><url> </dt>
<dd>URL of custom cursor. More than one URL may be provided as fallback, in case some cursor image types are not supported. A non-URL fallback (one of the other values) must be at the end of the fallback list. See <a href="pt/Using_URL_values_for_the_cursor_property">Using URL values for the cursor property</a> for more details.</dd>
<dt><code>default</code> </dt>
<dd>default cursor (typically an arrow)</dd>
<dt><code>auto</code> </dt>
<dd>equivalent to <code>text</code> when over text and <code>default</code> otherwise</dd>
<dt><code>crosshair</code> </dt>
<dd>cross cursor, often used to indicate selection in a bitmap</dd>
<dt><code>pointer</code> </dt>
<dd>cursor used when over links (typically a hand)</dd>
<dt><code>move</code> </dt>
<dd>move cursor</dd>
<dt><code>e-resize</code> </dt>
<dd>cursor for resizing the right edge of a box</dd>
<dt><code>ne-resize</code> </dt>
<dd>cursor for resizing the top right corner of a box</dd>
<dt><code>nw-resize</code> </dt>
<dd>cursor for resizing the top left corner of a box</dd>
<dt><code>n-resize</code> </dt>
<dd>cursor for resizing the top edge of a box</dd>
<dt><code>se-resize</code> </dt>
<dd>cursor for resizing the bottom right corner of a box</dd>
<dt><code>sw-resize</code> </dt>
<dd>cursor for resizing the bottom left corner of a box</dd>
<dt><code>s-resize</code> </dt>
<dd>cursor for resizing the bottom edge of a box</dd>
<dt><code>w-resize</code> </dt>
<dd>cursor for resizing the left edge of a box</dd>
<dt><code>text</code> </dt>
<dd>cursor indicating text can be selected (typically an I-beam)</dd>
<dt><code>wait</code> </dt>
<dd>cursor indicating the program is busy (sometimes an hourglass or a watch)</dd>
<dt><code>help</code> </dt>
<dd>cursor indicating help is available</dd>
<dt><code>progress</code> </dt>
<dd>cursor indicating that the program is busy but the user can still interact with it (unlike for <code>busy</code>)</dd>
<dt><code>copy</code> </dt>
<dd>cursor showing something that can be copied</dd>
<dt><code>alias</code> </dt>
<dd>cursor indicating an alias or shortcut is to be created</dd>
<dt><code>context-menu</code> </dt>
<dd>cursor indicating that a context menu is available under the cursor</dd>
<dt><code>cell</code> </dt>
<dd>cursor indicating that cells can be selected</dd>
<dt><code>not-allowed</code> </dt>
<dd>cursor showing that something cannot be done</dd>
<dt><code>col-resize</code> </dt>
<dd>cursor for resizing columns horizontally</dd>
<dt><code>row-resize</code> </dt>
<dd>cursor for resizing rows vertically</dd>
<dt><code>no-drop</code> </dt>
<dd>cursor showing that a drop is not allowed at the current location</dd>
<dt><code>vertical-text</code> </dt>
<dd>cursor indicating that vertical text can be selected (typically a sideways I-beam)</dd>
<dt><code>all-scroll</code> </dt>
<dd>cursor showing that something can be scrolled in any direction (panned)</dd>
<dt><code>nesw-resize</code> </dt>
<dd>cursor for resizing in the top-right or bottom-left directions</dd>
<dt><code>nwse-resize</code> </dt>
<dd>cursor for resizing in the top-left or bottom-right directions</dd>
<dt><code>ns-resize</code> </dt>
<dd>cursor for resizing up or down</dd>
<dt><code>ew-resize</code> </dt>
<dd>cursor for resizing left or right</dd>
</dl>
<h3 id="Exemplos" name="Exemplos">Exemplos</h3>
<p><a href="/samples/cssref/cursor.html">View Live Examples</a></p>
<pre>Inline:
<span style="cursor: crosshair">Some Text</span>
External:
.pointer {
cursor: pointer;
}
.move {
cursor: move;
}
</pre>
<h3 id="Notas" name="Notas">Notas</h3>
<p>While this property works on older browsers, not all values are fully supported.</p>
<h3 id="Especifica.C3.A7.C3.B5es" name="Especifica.C3.A7.C3.B5es">Especificações</h3>
<ul>
<li><a class="external" href="http://www.w3.org/TR/CSS21/ui.html#propdef-cursor">CSS 2.1</a></li>
<li><a class="external" href="http://www.w3.org/TR/css3-ui/#cursor">css3-ui</a></li>
</ul>
<h3 id="Compatibilidade_com_navegadores" name="Compatibilidade_com_navegadores">Compatibilidade com navegadores</h3>
<table class="standard-table">
<tbody>
<tr>
<th>Navegador</th>
<th>Versão mais antiga/th></th>
</tr>
<tr>
<td>Internet Explorer</td>
<td>4</td>
</tr>
<tr>
<td>Firefox</td>
<td>1.5</td>
</tr>
<tr>
<td>Netscape</td>
<td>6</td>
</tr>
<tr>
<td>Opera</td>
<td>7</td>
</tr>
</tbody>
</table>
<h3 id="Veja_tamb.C3.A9m" name="Veja_tamb.C3.A9m">Veja também</h3>
<p><span class="comment">Categorias</span></p>
<p><span class="comment">Interwiki Language Links</span></p>
<p>{{ languages( { "en": "en/CSS/cursor", "fr": "fr/CSS/cursor", "pl": "pl/CSS/cursor" } ) }}</p>
|
