diff options
Diffstat (limited to 'files/fr/web/html/element/map/index.md')
| -rw-r--r-- | files/fr/web/html/element/map/index.md | 177 |
1 files changed, 89 insertions, 88 deletions
diff --git a/files/fr/web/html/element/map/index.md b/files/fr/web/html/element/map/index.md index 0587aefb35..c097778c97 100644 --- a/files/fr/web/html/element/map/index.md +++ b/files/fr/web/html/element/map/index.md @@ -8,114 +8,115 @@ tags: - Web translation_of: Web/HTML/Element/map --- -<div>{{HTMLRef}}</div> +{{HTMLRef}} -<p>L'élément HTML<strong> <code><map></code></strong> est utilisé avec des éléments {{HTMLElement("area")}} afin de définir une image cliquable divisée en régions.</p> +L'élément HTML** `<map>`** est utilisé avec des éléments {{HTMLElement("area")}} afin de définir une image cliquable divisée en régions. -<div>{{EmbedInteractiveExample("pages/tabbed/map.html", "tabbed-standard")}}</div> +{{EmbedInteractiveExample("pages/tabbed/map.html", "tabbed-standard")}} -<h2 id="Attributs">Attributs</h2> +## Attributs -<p>Comme tous les autres éléments HTML, cet élément inclut <a href="/fr/docs/Web/HTML/Attributs_universels">les attributs universels</a>.</p> +Comme tous les autres éléments HTML, cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_universels). -<dl> - <dt>{{htmlattrdef("name")}}</dt> - <dd>Cet attribut fournit un nom afin que la carte cliquable puisse être référencée. Cet attribut est obligatoire et sa valeur doit être une chaîne de caractères non-vide qui ne contient pas de blancs. La valeur de cet attribut doit être unique pour tous les éléments {{HTMLElement("map")}} du document. Si l'attribut universel <code>id</code> est utilisé, <code>name</code> devra avoir la même valeur que celui-ci.</dd> -</dl> +- {{htmlattrdef("name")}} + - : Cet attribut fournit un nom afin que la carte cliquable puisse être référencée. Cet attribut est obligatoire et sa valeur doit être une chaîne de caractères non-vide qui ne contient pas de blancs. La valeur de cet attribut doit être unique pour tous les éléments {{HTMLElement("map")}} du document. Si l'attribut universel `id` est utilisé, `name` devra avoir la même valeur que celui-ci. -<h2 id="Exemples">Exemples</h2> +## Exemples -<h3 id="HTML">HTML</h3> +### HTML -<pre class="brush: html"><map name="primary"> - <area shape="circle" coords="75,75,75" href="left.html"> - <area shape="circle" coords="275,75,75" href="right.html"> -</map> -<img usemap="#primary" src="https://via.placeholder.com/350x150" alt="350 x 150 pic"> -</pre> +```html +<map name="primary"> + <area shape="circle" coords="75,75,75" href="left.html"> + <area shape="circle" coords="275,75,75" href="right.html"> +</map> +<img usemap="#primary" src="https://via.placeholder.com/350x150" alt="350 x 150 pic"> +``` -<h3 id="Résultat">Résultat</h3> +### Résultat -<p>{{EmbedLiveSample("Exemples","450","230")}}</p> +{{EmbedLiveSample("Exemples","450","230")}} -<h3 id="Résultat_attendu">Résultat attendu</h3> +### Résultat attendu -<p>L'exemple précédent devrait faire apparaître des images semblables (en utilisant la touche <kbd>tab</kbd> de votre clavier) :</p> +L'exemple précédent devrait faire apparaître des images semblables (en utilisant la touche <kbd>tab</kbd> de votre clavier) : -<p><em>Pour le lien <code>left.html</code> :</em><br> - <img alt="" src="screen_shot_2017-02-02_at_10.48.40_pm.png"></p> +_Pour le lien `left.html` :_ + -<p><em>Pour le lien <code>right.html</code> </em><br> - <img alt="" src="screen_shot_2017-02-02_at_10.49.04_pm.png"></p> +_Pour le lien `right.html` _ + - -<h2 id="Résumé_technique">Résumé technique</h2> +## Résumé technique <table class="properties"> - <tbody> - <tr> - <th scope="row"><a href="/fr/docs/Web/HTML/Catégorie_de_contenu">Catégories de contenu</a></th> - <td><a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_de_flux">Contenu de flux</a>, <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_phrasé">contenu phrasé</a>, <a href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Contenu_tangible">contenu tangible</a>.</td> - </tr> - <tr> - <th scope="row">Contenu autorisé</th> - <td>Tout élément dont <a href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Mod%C3%A8le_de_contenu_transparent">le modèle de contenu est transparent</a>.</td> - </tr> - <tr> - <th scope="row">Omission de balises</th> - <td>{{no_tag_omission}}</td> - </tr> - <tr> - <th scope="row">Parents autorisés</th> - <td>Tout élément qui accepte <a href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Contenu_phras%C3%A9">du contenu phrasé</a>.</td> - </tr> - <tr> - <th scope="row">Rôles ARIA autorisés</th> - <td>Aucun.</td> - </tr> - <tr> - <th scope="row">Interface DOM</th> - <td>{{domxref("HTMLMapElement")}}</td> - </tr> - </tbody> + <tbody> + <tr> + <th scope="row"> + <a href="/fr/docs/Web/HTML/Catégorie_de_contenu" + >Catégories de contenu</a + > + </th> + <td> + <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_de_flux" + >Contenu de flux</a + >, + <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_phrasé" + >contenu phrasé</a + >, + <a href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Contenu_tangible" + >contenu tangible</a + >. + </td> + </tr> + <tr> + <th scope="row">Contenu autorisé</th> + <td> + Tout élément dont + <a + href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Mod%C3%A8le_de_contenu_transparent" + >le modèle de contenu est transparent</a + >. + </td> + </tr> + <tr> + <th scope="row">Omission de balises</th> + <td>{{no_tag_omission}}</td> + </tr> + <tr> + <th scope="row">Parents autorisés</th> + <td> + Tout élément qui accepte + <a + href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Contenu_phras%C3%A9" + >du contenu phrasé</a + >. + </td> + </tr> + <tr> + <th scope="row">Rôles ARIA autorisés</th> + <td>Aucun.</td> + </tr> + <tr> + <th scope="row">Interface DOM</th> + <td>{{domxref("HTMLMapElement")}}</td> + </tr> + </tbody> </table> -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaires</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('HTML WHATWG', 'embedded-content.html#the-map-element', '<map>')}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('HTML5 W3C', 'embedded-content-0.html#the-map-element', '<map>')}}</td> - <td>{{Spec2('HTML5 W3C')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('HTML4.01', 'struct/objects.html#h-13.6.1', '<map>')}}</td> - <td>{{Spec2('HTML4.01')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> +## Spécifications + +| Spécification | État | Commentaires | +| ---------------------------------------------------------------------------------------------------------------- | -------------------------------- | -------------------- | +| {{SpecName('HTML WHATWG', 'embedded-content.html#the-map-element', '<map>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'embedded-content-0.html#the-map-element', '<map>')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'struct/objects.html#h-13.6.1', '<map>')}} | {{Spec2('HTML4.01')}} | Définition initiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("html.elements.map")}}</p> +{{Compat("html.elements.map")}} -<h2 id="Voir_aussi">Voir aussi</h2> +## Voir aussi -<ul> - <li>{{HTMLElement("a")}}</li> - <li>{{HTMLElement("area")}}</li> -</ul> +- {{HTMLElement("a")}} +- {{HTMLElement("area")}} |