files/pt-br/web/html/element/map/index.html


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

---
title: <map>
slug: Web/HTML/Element/map
translation_of: Web/HTML/Element/map
---
<h2 id="Resumo">Resumo</h2>

<p>O <strong>elemento HTML <code>&lt;map&gt;</code></strong> é usado com os elementos {{HTMLElement ("area")}} para definir um mapa de imagem (a área clicável do link).</p>

<ul class="htmlelt">
 <li><dfn><a href="/en-US/docs/HTML/Content_categories" title="HTML / Content_categories">Categorias de conteúdo</a></dfn> <a href="/en-US/docs/HTML/Content_categories#Flow_content" title="Categorias HTML / conteúdo # content Fluxo">Conteúdo de fluxo</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="Categorias HTML / conteúdo # content Phrasing">conteúdo fraseado</a>, conteúdo palpável.</li>
 <li><dfn>Conteúdo permitido</dfn>Qualquer elemento <a href="/en-US/docs/HTML/Content_categories#Transparent_content_model" title="https://developer.mozilla.org/en/HTML/Content_categories # Transparent_content_model">transparente</a>.</li>
 <li><dfn>Omissão da marcação</dfn>{{no_tag_omission}}</li>
 <li><dfn>Elementos pai permitidos</dfn> Qualquer elemento que aceita <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML / Content_categories # Phrasing_content">conteúdo fraseado</a>.</li>
 <li><dfn>Interface DOM</dfn> {{domxref ("HTMLMapElement")}}</li>
</ul>

<h2 id="Atributos">Atributos</h2>

<p><span style="line-height: 21px;">Este elemento inclui os </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML / atributos globais">atributos globais</a><span style="line-height: 21px;">.</span></p>

<dl>
 <dt>{{Htmlattrdef ("name")}}</dt>
 <dd>O atributo name dá ao mapa de um nome, de modo que ela possa ser referenciada. O atributo deve estar presente e ter um valor não vazio, sem caracteres de espaço. O valor do atributo name não deve corresponder (independente da caixa) a um valor do atributo name de outro elemento no mesmo documento. Se o id de atributo também for especificado, ambos os atributos devem ter o mesmo valor.</dd>
</dl>

<h2 id="Exemplos">Exemplos</h2>

<pre class="brush: html">&lt;map&gt;
  &lt;area shape="circle" coords="200,250,25" href="another.htm" /&gt;
  &lt;area shape="default" /&gt;
&lt;/map&gt;
</pre>

<h2 id="Specifications" name="Specifications">Especificações</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Especificação</th>
   <th scope="col">Estado</th>
   <th scope="col">Comentário</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName ('HTML WHATWG', 'a-map-element.html # the-map-elemento', '&lt;map&gt;')}}</td>
   <td>{{Spec2 ('HTML WHATWG')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName ('HTML5 W3C', 'incorporado-content-0.html # the-map-elemento', '&lt;map&gt;')}}</td>
   <td>{{Spec2 ('HTML5 W3C')}}</td>
   <td> </td>
  </tr>
  <tr>
   <td>{{SpecName ('HTML4.01', 'struct / objects.html # h-13.6.1', '&lt;map&gt;')}}</td>
   <td>{{Spec2 ('HTML4.01')}}</td>
   <td> </td>
  </tr>
 </tbody>
</table>

<h2 id="Compatibilidade_do_navegador">Compatibilidade do navegador</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Característica</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Suporte básico</td>
   <td>1.0</td>
   <td>{{CompatGeckoDesktop (1,0)}} [1] [2]</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>1.0</td>
   <td>1.0</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Característica</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Suporte básico</td>
   <td>1.0</td>
   <td>{{CompatGeckoMobile (1,0)}} [1] [2]</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>1.0</td>
   <td>1.0</td>
  </tr>
 </tbody>
</table>
</div>

<h3 id="Notas_Gecko">Notas Gecko</h3>

<p>[1] A partir do Gecko 5.0 {{geckoRelease ("5.0")}}, mapas vazios já não são ignorados para favorecer outros preenchidos quando há correspondência no modo quirk. Por exemplo, consideremos o seguinte HTML:</p>

<pre class="brush: html">&lt;map&gt;&lt;/ map&gt;
&lt;map&gt;
  &lt;area shape="rect" coords="25,25,75,75" href="#fail"&gt;
&lt;/map&gt;
&lt;img usemap="#a" src="image.png"&gt;
</pre>

<p>[2] Antes do Gecko 5.0, o elemento {{HTMLElement ("img")}} devia corresponder ao segundo mapa preenchido. Agora correspode apenas ao primeiro, mesmo que ele esteja vazio.</p>

<p>[3] A partir do Firefox 17 o estilo padrão do elemento HTML <code>&lt;map&gt;</code> é <code>display: inline;</code> e não mais <code>display: block;</code> . Isso coincide com o comportamento dos outros navegadores e já foi resolvido no modo quirk.</p>

<h2 id="Veja_também">Veja também</h2>

<ul>
 <li>{{HTMLElement ("a")}}</li>
 <li>{{HTMLElement ("area")}}</li>
</ul>

<p>{{HTMLRef}}</p>