diff options
Diffstat (limited to 'files/fr/web/guide/html/editable_content/index.md')
| -rw-r--r-- | files/fr/web/guide/html/editable_content/index.md | 73 |
1 files changed, 42 insertions, 31 deletions
diff --git a/files/fr/web/guide/html/editable_content/index.md b/files/fr/web/guide/html/editable_content/index.md index b5295b8c40..1a23f229f6 100644 --- a/files/fr/web/guide/html/editable_content/index.md +++ b/files/fr/web/guide/html/editable_content/index.md @@ -4,34 +4,45 @@ slug: Web/Guide/HTML/Editable_content translation_of: Web/Guide/HTML/Editable_content original_slug: Web/HTML/Contenu_editable --- -<h2 id="Introduction">Introduction</h2> -<p>Chaque élément du HTML5 peut être éditable. Cette fonctionnalité a été introduite longtemps auparavant mais a maintenant été standarisée avec <a class="external" href="http://www.whatwg.org/">WHATWG</a> (<a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/editing.html#contenteditable">voir la spécification HTML actuelle</a>). Avec des gestionnaires d'événements JavaScript, vous pouvez transformer votre page Web en un éditeur de texte, complet et rapide.</p> -<h2 id="Compatibilité">Compatibilité</h2> -<p>Le contenu éditable est entièrement compatible avec les navigateurs actuels :</p> -<ul> - <li>Firefox 3.5+</li> - <li>Chrome 6.0+</li> - <li>Internet Explorer 6.0+</li> - <li>Safari 3.2+</li> - <li>Opera 8+</li> - <li>iOS Safari 5.0+</li> - <li>Android Browser 3.0+</li> -</ul> -<p>Ce n'est pas encore supporté par Opera Mini et Opera Mobile.</p> -<h2 id="Comment_ça_marche">Comment ça marche ?</h2> -<p>Fixez l'attribut <code>contenteditable</code> à <code>true</code> dans votre élément HTML. Ça peut être fait dans quasiment tous les éléments HTML.</p> -<h2 id="Exemples">Exemples</h2> -<p>Un exemple simple :</p> -<pre><!DOCTYPE html> -<html> - <body> - <div contenteditable="true"> - Ce texte peut être édité par l'utilisateur. - </div> - </body> -</html> </pre> -<p>Vous pouvez observer un exemple concret intégrant JavaScript utilisant LocalStorage <a class="external" href="http://html5demos.com/contenteditable">ici</a>. Le code source est disponible <a href="http://html5demos.com/contenteditable#view-source">ici</a>.</p> -<h2 id="Voir_aussi">Voir aussi</h2> -<p><a href="/fr/docs/Midas" title="en/Midas">Comment interagir avec le contenu </a>(style proche de l'ancienne API Internet Explorer) ou encore <a href="/fr/docs/Rich-Text_Editing_in_Mozilla" title="en/rich-text editing in mozilla">ici</a>.</p> -<div> - {{ languages({ "ja": "ja/HTML/Content_Editable", "zh-cn": "zh-cn/HTML/Content_Editable" }) }}</div> +## Introduction + +Chaque élément du HTML5 peut être éditable. Cette fonctionnalité a été introduite longtemps auparavant mais a maintenant été standarisée avec [WHATWG](http://www.whatwg.org/) ([voir la spécification HTML actuelle](http://www.whatwg.org/specs/web-apps/current-work/multipage/editing.html#contenteditable)). Avec des gestionnaires d'événements JavaScript, vous pouvez transformer votre page Web en un éditeur de texte, complet et rapide. + +## Compatibilité + +Le contenu éditable est entièrement compatible avec les navigateurs actuels : + +- Firefox 3.5+ +- Chrome 6.0+ +- Internet Explorer 6.0+ +- Safari 3.2+ +- Opera 8+ +- iOS Safari 5.0+ +- Android Browser 3.0+ + +Ce n'est pas encore supporté par Opera Mini et Opera Mobile. + +## Comment ça marche ? + +Fixez l'attribut `contenteditable` à `true` dans votre élément HTML. Ça peut être fait dans quasiment tous les éléments HTML. + +## Exemples + +Un exemple simple : + + <!DOCTYPE html> + <html> + <body> + <div contenteditable="true"> + Ce texte peut être édité par l'utilisateur. + </div> + </body> + </html> + +Vous pouvez observer un exemple concret intégrant JavaScript utilisant LocalStorage [ici](http://html5demos.com/contenteditable). Le code source est disponible [ici](http://html5demos.com/contenteditable#view-source). + +## Voir aussi + +[Comment interagir avec le contenu ](/fr/docs/Midas "en/Midas")(style proche de l'ancienne API Internet Explorer) ou encore [ici](/fr/docs/Rich-Text_Editing_in_Mozilla "en/rich-text editing in mozilla"). + +{{ languages({ "ja": "ja/HTML/Content_Editable", "zh-cn": "zh-cn/HTML/Content_Editable" }) }} |