Redo fix for #2890 in md (#2957)

author: SphinxKnight <SphinxKnight@users.noreply.github.com> 2021-12-04 17:38:30 +0100
committer: GitHub <noreply@github.com> 2021-12-04 17:38:30 +0100
commit: 530dfca848063fd49ef4b73c169bfb9485e12e85 (patch)
tree: a6f5c70c4c7064ec96bafc71c1c6ee648e734688 /files/fr
parent: e11085ffae53e32944433641373d2e1472b13e1b (diff)
download: translated-content-530dfca848063fd49ef4b73c169bfb9485e12e85.tar.gz
translated-content-530dfca848063fd49ef4b73c169bfb9485e12e85.tar.bz2
translated-content-530dfca848063fd49ef4b73c169bfb9485e12e85.zip
1 files changed, 205 insertions, 27 deletions
diff --git a/files/fr/web/guide/html/editable_content/index.md b/files/fr/web/guide/html/editable_content/index.md
index 1e1f4fdb29..71598b7197 100644
--- a/files/fr/web/guide/html/editable_content/index.md
+++ b/files/fr/web/guide/html/editable_content/index.md
@@ -1,46 +1,224 @@
 ---
-title: Contenu éditable
+title: Rendre le contenu éditable
 slug: Web/Guide/HTML/Editable_content
 translation_of: Web/Guide/HTML/Editable_content
 original_slug: Web/HTML/Contenu_editable
 ---
-## Introduction
+> **Attention :**  Comme indiqué par l'avertissement de la spécification pour [`execCommand()`](https://w3c.github.io/editing/docs/execCommand/), les fonctionnalités correspondantes ne sont pas implémentées complètement ou de façon cohérente entre les différents agents utilisateurs. De plus, cette fonction est indiquée comme dépréciée sur la page de référence pour [`Document.execCommand()`](/fr/docs/Web/API/Document/execCommand). Aussi, ce qui suit sur cette page ne devrait pas être utilisé pour du code en production.
 
-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.
+En HTML, tout élément peut être éditable. En utilisant des gestionnaires d'évènements JavaScript, on peut transformer une page web en un éditeur de texte riche. Cet article fournit des informations à propos de cette fonctionnalité.
 
-## Compatibilité
+> **Note :** À partir de Firefox 63 Beta/Dev, certaines des fonctionnalités d'édition de texte riche ont été désactivées par défaut pour des raisons de compatibilité entre navigateurs. Les fonctionnalités retirées concernent des objets pour redimensionner des images ([`<img>`](/fr/docs/Web/HTML/Element/Img)), des tableaux ([`<table>`](/fr/docs/Web/HTML/Element/table)), et des éléments positionnés de façon absolue&nbsp;; l'édition de tableaux en ligne pour ajouter ou retirer des lignes ou des colonnes&nbsp;; la poignée qui permet de déplacer des éléments positionnés de façon absolue. Voir le [bug 1449564](https://bugzilla.mozilla.org/show_bug.cgi?id=1449564) pour plus de détails.
 
-Le contenu éditable est entièrement compatible avec les navigateurs actuels :
+## Le fonctionnement
 
-- Firefox 3.5+
-- Chrome 6.0+
-- Internet Explorer 6.0+
-- Safari 3.2+
-- Opera 8+
-- iOS Safari 5.0+
-- Android Browser 3.0+
+Pour rendre un élément HTML éditable, il suffira de lui ajouter l'attribut [`contenteditable`](/fr/docs/Web/HTML/Global_attributes#attr-contenteditable). Cela fonctionne pour la quasi-totalité des éléments.
 
-Ce n'est pas encore supporté par Opera Mini et Opera Mobile.
+Voici un exemple simple qui crée un élément [`<div>`](/fr/docs/Web/HTML/Element/div) dont le contenu peut être édité par l'utilisateur.
 
-## Comment ça marche ?
+```html
+<div contenteditable="true">
+  Vous pouvez éditer ce texte lorsque vous consultez la page.
+</div>
+```
 
-Fixez l'attribut `contenteditable` à `true` dans votre élément HTML. Ça peut être fait dans quasiment tous les éléments HTML.
+Et voici le résultat obtenu avec ce fragment HTML&nbsp;:
 
-## Exemples
+{{EmbedLiveSample('Le fonctionnement')}}
 
-Un exemple simple :
+## Exécuter des commandes
 
-    <!DOCTYPE html>
-    <html>
-      <body>
-        <div contenteditable="true">
-          Ce texte peut être édité par l'utilisateur.
-        </div>
-      </body>
-    </html>
+Lorsqu'un élément HTML a un attribut `contenteditable` qui vaut `true`, la méthode [`document.execCommand()`](/fr/docs/Web/API/Document/execCommand) devient disponible. Cela permet d'exécuter des [commandes](/fr/docs/Web/API/Document/execCommand#commandes) our manipuler les contenus de la région éditable. Certaines commandes affectent la sélection du document en mettant par exemple en forme le texte (gras, italique, etc.) tandis que d'autres insèrent de nouveaux éléments (par exemple un nouveau lien) ou portent sur tout une ligne (par exemple pour l'indenter). Lorsqu'on utilise `contentEditable`, appeler `execCommand()` aura un impact sur l'ensemble de l'élément éditable courant qui est actif.
 
-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).
+## Différences de génération de balisage
+
+L'utilisation de `contenteditable` parmi les différents navigateurs fut longtemps compliqué en raison des différences sur le balisage généré. Ainsi, même une action simple (presser Entrée pour créer une nouvelle ligne de texte au sein d'un élément éditable) pouvait être gérée différemment selon les navigateurs (Firefox insérait un élément [`<br>`](/fr/docs/Web/HTML/Element/br), IE/Opera ajoutaient un élément [`<p>`](fr/docs/Web/HTML/Element/p), Chrome/Safari ajoutaient un élément [`<div>`](/fr/docs/Web/HTML/Element/div).
+
+Cela s'est heureusement amélioré avec le temps et une meilleure cohérence s'est mise en place. Avec [Firefox 60](/fr/docs/Mozilla/Firefox/Releases/60), Firefox placera les différentes lignes dans des éléments [`<div>`](/fr/docs/Web/HTML/Element/div), ayant ainsi le même comportement que Chrome, Opera, Edge, et Safari.
+
+Vous pouvez essayer ceci dans l'exemple ci-avant.
+
+> **Note :** Internet Explorer, qui n'est plus maintenu, utilisait des éléments [`<p>`](/fr/docs/Web/HTML/Element/p) plutôt que des [`<div>`].
+
+Si vous souhaitez utiliser un séparateur de paragraphe différent, l'ensemble des navigateurs prennent en charge [`document.execCommand`](/fr/docs/Web/API/Document/execCommand), qui fournit une commande `defaultParagraphSeparator` pour changer ce séparateur. Ainsi, pour utiliser des paragraphes ([`<p>`](/fr/docs/Web/HTML/Element/p)), on pourra exécuter&nbsp;:
+
+```js
+document.execCommand("defaultParagraphSeparator", false, "p");
+```
+
+De plus, Firefox prend en charge un argument *non-standard*, `br`, pour `defaultParagraphSeparator` depuis Firefox 55. Celui-ci peut s'avérer utile au cas où votre application web se base sur le comportement utilisé par les anciennes versions de Firefox. Pour retrouver l'ancien comportement de Firefox, vous pourrez utiliser cette ligne (uniquement dans Firefox)&nbsp;:
+
+```js
+document.execCommand("defaultParagraphSeparator", false, "br");
+```
+
+## Sécurité
+
+Pour des raisons de sécurité, par défaut, Firefox ne permet pas au code JavaScript d'utiliser les fonctionnalités du presse-papier (copier, coller, etc.). Cela peut être débrayé dans les préférences `about:config`&nbsp;:
+
+    user_pref("capability.policy.policynames", "allowclipboard");
+    user_pref("capability.policy.allowclipboard.sites", "https://www.mozilla.org");
+    user_pref("capability.policy.allowclipboard.Clipboard.cutcopy", "allAccess");
+    user_pref("capability.policy.allowclipboard.Clipboard.paste", "allAccess");
+
+## Un exemple d'éditeur de texte
+
+```html
+<!doctype html>
+<html>
+<head>
+<title>Rich Text Editor</title>
+<script type="text/javascript">
+var oDoc, sDefTxt;
+
+function initDoc() {
+  oDoc = document.getElementById("textBox");
+  sDefTxt = oDoc.innerHTML;
+  if (document.compForm.switchMode.checked) { setDocMode(true); }
+}
+
+function formatDoc(sCmd, sValue) {
+  if (validateMode()) { document.execCommand(sCmd, false, sValue); oDoc.focus(); }
+}
+
+function validateMode() {
+  if (!document.compForm.switchMode.checked) { return true ; }
+  alert("Uncheck \"Show HTML\".");
+  oDoc.focus();
+  return false;
+}
+
+function setDocMode(bToSource) {
+  var oContent;
+  if (bToSource) {
+  oContent = document.createTextNode(oDoc.innerHTML);
+  oDoc.innerHTML = "";
+  var oPre = document.createElement("pre");
+  oDoc.contentEditable = false;
+  oPre.id = "sourceText";
+  oPre.contentEditable = true;
+  oPre.appendChild(oContent);
+  oDoc.appendChild(oPre);
+    document.execCommand("defaultParagraphSeparator", false, "div");
+  } else {
+  if (document.all) {
+  oDoc.innerHTML = oDoc.innerText;
+  } else {
+  oContent = document.createRange();
+  oContent.selectNodeContents(oDoc.firstChild);
+  oDoc.innerHTML = oContent.toString();
+  }
+  oDoc.contentEditable = true;
+  }
+  oDoc.focus();
+}
+
+function printDoc() {
+  if (!validateMode()) { return; }
+  var oPrntWin = window.open("","_blank","width=450,height=470,left=400,top=100,menubar=yes,toolbar=no,location=no,scrollbars=yes");
+  oPrntWin.document.open();
+  oPrntWin.document.write("<!doctype html><html><head><title>Print<\/title><\/head><body onload=\"print();\">" + oDoc.innerHTML + "<\/body><\/html>");
+  oPrntWin.document.close();
+}
+</script>
+<style type="text/css">
+.intLink { cursor: pointer; }
+img.intLink { border: 0; }
+#toolBar1 select { font-size:10px; }
+#textBox {
+  width: 540px;
+  height: 200px;
+  border: 1px #000000 solid;
+  padding: 12px;
+  overflow: scroll;
+}
+#textBox #sourceText {
+  padding: 0;
+  margin: 0;
+  min-width: 498px;
+  min-height: 200px;
+}
+#editMode label { cursor: pointer; }
+</style>
+</head>
+<body onload="initDoc();">
+<form name="compForm" method="post" action="sample.php" onsubmit="if(validateMode()){this.myDoc.value=oDoc.innerHTML;return true;}return false;">
+<input type="hidden" name="myDoc">
+<div id="toolBar1">
+<select onchange="formatDoc('formatblock',this[this.selectedIndex].value);this.selectedIndex=0;">
+<option selected>- formatting -</option>
+<option value="h1">Title 1 &lt;h1&gt;</option>
+<option value="h2">Title 2 &lt;h2&gt;</option>
+<option value="h3">Title 3 &lt;h3&gt;</option>
+<option value="h4">Title 4 &lt;h4&gt;</option>
+<option value="h5">Title 5 &lt;h5&gt;</option>
+<option value="h6">Subtitle &lt;h6&gt;</option>
+<option value="p">Paragraph &lt;p&gt;</option>
+<option value="pre">Preformatted &lt;pre&gt;</option>
+</select>
+<select onchange="formatDoc('fontname',this[this.selectedIndex].value);this.selectedIndex=0;">
+<option class="heading" selected>- font -</option>
+<option>Arial</option>
+<option>Arial Black</option>
+<option>Courier New</option>
+<option>Times New Roman</option>
+</select>
+<select onchange="formatDoc('fontsize',this[this.selectedIndex].value);this.selectedIndex=0;">
+<option class="heading" selected>- size -</option>
+<option value="1">Very small</option>
+<option value="2">A bit small</option>
+<option value="3">Normal</option>
+<option value="4">Medium-large</option>
+<option value="5">Big</option>
+<option value="6">Very big</option>
+<option value="7">Maximum</option>
+</select>
+<select onchange="formatDoc('forecolor',this[this.selectedIndex].value);this.selectedIndex=0;">
+<option class="heading" selected>- color -</option>
+<option value="red">Red</option>
+<option value="blue">Blue</option>
+<option value="green">Green</option>
+<option value="black">Black</option>
+</select>
+<select onchange="formatDoc('backcolor',this[this.selectedIndex].value);this.selectedIndex=0;">
+<option class="heading" selected>- background -</option>
+<option value="red">Red</option>
+<option value="green">Green</option>
+<option value="black">Black</option>
+</select>
+</div>
+<div id="toolBar2">
+<img class="intLink" title="Clean" onclick="if(validateMode()&&confirm('Are you sure?')){oDoc.innerHTML=sDefTxt};" src="data:image/gif;base64,R0lGODlhFgAWAIQbAD04KTRLYzFRjlldZl9vj1dusY14WYODhpWIbbSVFY6O7IOXw5qbms+wUbCztca0ccS4kdDQjdTLtMrL1O3YitHa7OPcsd/f4PfvrvDv8Pv5xv///////////////////yH5BAEKAB8ALAAAAAAWABYAAAV84CeOZGmeaKqubMteyzK547QoBcFWTm/jgsHq4rhMLoxFIehQQSAWR+Z4IAyaJ0kEgtFoLIzLwRE4oCQWrxoTOTAIhMCZ0tVgMBQKZHAYyFEWEV14eQ8IflhnEHmFDQkAiSkQCI2PDC4QBg+OAJc0ewadNCOgo6anqKkoIQA7" />
+<img class="intLink" title="Print" onclick="printDoc();" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAABGdBTUEAALGPC/xhBQAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9oEBxcZFmGboiwAAAAIdEVYdENvbW1lbnQA9syWvwAAAuFJREFUOMvtlUtsjFEUx//n3nn0YdpBh1abRpt4LFqtqkc3jRKkNEIsiIRIBBEhJJpKlIVo4m1RRMKKjQiRMJRUqUdKPT71qpIpiRKPaqdF55tv5vvusZjQTjOlseUkd3Xu/3dPzusC/22wtu2wRn+jG5So/OCDh8ycMJDflehMlkJkVK7KUYN+ufzA/RttH76zaVocDptRxzQtNi3mRWuPc+6cKtlXZ/sddP2uu9uXlmYXZ6Qm8v4Tz8lhF1H+zDQXt7S8oLMXtbF4e8QaFHjj3kbP2MzkktHpiTjp9VH6iHiA+whtAsX5brpwueMGdONdf/2A4M7ukDs1JW662+XkqTkeUoqjKtOjm2h53YFL15pSJ04Zc94wdtibr26fXlC2mzRvBccEbz2kiRFD414tKMlEZbVGT33+qCoHgha81SWYsew0r1uzfNylmtpx80pngQQ91LwVk2JGvGnfvZG6YcYRAT16GFtW5kKKfo1EQLtfh5Q2etT0BIWF+aitq4fDbk+ImYo1OxvGF03waFJQvBCkvDffRyEtxQiFFYgAZTHS0zwAGD7fG5TNnYNTp8/FzvGwJOfmgG7GOx0SAKKgQgDMgKBI0NJGMEImpGDk5+WACEwEd0ywblhGUZ4Hw5OdUekRBLT7DTgdEgxACsIznx8zpmWh7k4rkpJcuHDxCul6MDsmmBXDlWCH2+XozSgBnzsNCEE4euYV4pwCpsWYPW0UHDYBKSWu1NYjENDReqtKjwn2+zvtTc1vMSTB/mvev/WEYSlASsLimcOhOBJxw+N3aP/SjefNL5GePZmpu4kG7OPr1+tOfPyUu3BecWYKcwQcDFmwFKAUo90fhKDInBCAmvqnyMgqUEagQwCoHBDc1rjv9pIlD8IbVkz6qYViIBQGTJPx4k0XpIgEZoRN1Da0cij4VfR0ta3WvBXH/rjdCufv6R2zPgPH/e4pxSBCpeatqPrjNiso203/5s/zA171Mv8+w1LOAAAAAElFTkSuQmCC">
+<img class="intLink" title="Undo" onclick="formatDoc('undo');" src="data:image/gif;base64,R0lGODlhFgAWAOMKADljwliE33mOrpGjuYKl8aezxqPD+7/I19DV3NHa7P///////////////////////yH5BAEKAA8ALAAAAAAWABYAAARR8MlJq7046807TkaYeJJBnES4EeUJvIGapWYAC0CsocQ7SDlWJkAkCA6ToMYWIARGQF3mRQVIEjkkSVLIbSfEwhdRIH4fh/DZMICe3/C4nBQBADs=" />
+<img class="intLink" title="Redo" onclick="formatDoc('redo');" src="data:image/gif;base64,R0lGODlhFgAWAMIHAB1ChDljwl9vj1iE34Kl8aPD+7/I1////yH5BAEKAAcALAAAAAAWABYAAANKeLrc/jDKSesyphi7SiEgsVXZEATDICqBVJjpqWZt9NaEDNbQK1wCQsxlYnxMAImhyDoFAElJasRRvAZVRqqQXUy7Cgx4TC6bswkAOw==" />
+<img class="intLink" title="Remove formatting" onclick="formatDoc('removeFormat')" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAABGdBTUEAALGPC/xhBQAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAAd0SU1FB9oECQMCKPI8CIIAAAAIdEVYdENvbW1lbnQA9syWvwAAAuhJREFUOMtjYBgFxAB501ZWBvVaL2nHnlmk6mXCJbF69zU+Hz/9fB5O1lx+bg45qhl8/fYr5it3XrP/YWTUvvvk3VeqGXz70TvbJy8+Wv39+2/Hz19/mGwjZzuTYjALuoBv9jImaXHeyD3H7kU8fPj2ICML8z92dlbtMzdeiG3fco7J08foH1kurkm3E9iw54YvKwuTuom+LPt/BgbWf3//sf37/1/c02cCG1lB8f//f95DZx74MTMzshhoSm6szrQ/a6Ir/Z2RkfEjBxuLYFpDiDi6Af///2ckaHBp7+7wmavP5n76+P2ClrLIYl8H9W36auJCbCxM4szMTJac7Kza////R3H1w2cfWAgafPbqs5g7D95++/P1B4+ECK8tAwMDw/1H7159+/7r7ZcvPz4fOHbzEwMDwx8GBgaGnNatfHZx8zqrJ+4VJBh5CQEGOySEua/v3n7hXmqI8WUGBgYGL3vVG7fuPK3i5GD9/fja7ZsMDAzMG/Ze52mZeSj4yu1XEq/ff7W5dvfVAS1lsXc4Db7z8C3r8p7Qjf///2dnZGxlqJuyr3rPqQd/Hhyu7oSpYWScylDQsd3kzvnH738wMDzj5GBN1VIWW4c3KDon7VOvm7S3paB9u5qsU5/x5KUnlY+eexQbkLNsErK61+++VnAJcfkyMTIwffj0QwZbJDKjcETs1Y8evyd48toz8y/ffzv//vPP4veffxpX77z6l5JewHPu8MqTDAwMDLzyrjb/mZm0JcT5Lj+89+Ybm6zz95oMh7s4XbygN3Sluq4Mj5K8iKMgP4f0////fv77//8nLy+7MCcXmyYDAwODS9jM9tcvPypd35pne3ljdjvj26+H2dhYpuENikgfvQeXNmSl3tqepxXsqhXPyc666s+fv1fMdKR3TK72zpix8nTc7bdfhfkEeVbC9KhbK/9iYWHiErbu6MWbY/7//8/4//9/pgOnH6jGVazvFDRtq2VgiBIZrUTIBgCk+ivHvuEKwAAAAABJRU5ErkJggg==">
+<img class="intLink" title="Bold" onclick="formatDoc('bold');" src="data:image/gif;base64,R0lGODlhFgAWAID/AMDAwAAAACH5BAEAAAAALAAAAAAWABYAQAInhI+pa+H9mJy0LhdgtrxzDG5WGFVk6aXqyk6Y9kXvKKNuLbb6zgMFADs=" />
+<img class="intLink" title="Italic" onclick="formatDoc('italic');" src="data:image/gif;base64,R0lGODlhFgAWAKEDAAAAAF9vj5WIbf///yH5BAEAAAMALAAAAAAWABYAAAIjnI+py+0Po5x0gXvruEKHrF2BB1YiCWgbMFIYpsbyTNd2UwAAOw==" />
+<img class="intLink" title="Underline" onclick="formatDoc('underline');" src="data:image/gif;base64,R0lGODlhFgAWAKECAAAAAF9vj////////yH5BAEAAAIALAAAAAAWABYAAAIrlI+py+0Po5zUgAsEzvEeL4Ea15EiJJ5PSqJmuwKBEKgxVuXWtun+DwxCCgA7" />
+<img class="intLink" title="Left align" onclick="formatDoc('justifyleft');" src="data:image/gif;base64,R0lGODlhFgAWAID/AMDAwAAAACH5BAEAAAAALAAAAAAWABYAQAIghI+py+0Po5y02ouz3jL4D4JMGELkGYxo+qzl4nKyXAAAOw==" />
+<img class="intLink" title="Center align" onclick="formatDoc('justifycenter');" src="data:image/gif;base64,R0lGODlhFgAWAID/AMDAwAAAACH5BAEAAAAALAAAAAAWABYAQAIfhI+py+0Po5y02ouz3jL4D4JOGI7kaZ5Bqn4sycVbAQA7" />
+<img class="intLink" title="Right align" onclick="formatDoc('justifyright');" src="data:image/gif;base64,R0lGODlhFgAWAID/AMDAwAAAACH5BAEAAAAALAAAAAAWABYAQAIghI+py+0Po5y02ouz3jL4D4JQGDLkGYxouqzl43JyVgAAOw==" />
+<img class="intLink" title="Numbered list" onclick="formatDoc('insertorderedlist');" src="data:image/gif;base64,R0lGODlhFgAWAMIGAAAAADljwliE35GjuaezxtHa7P///////yH5BAEAAAcALAAAAAAWABYAAAM2eLrc/jDKSespwjoRFvggCBUBoTFBeq6QIAysQnRHaEOzyaZ07Lu9lUBnC0UGQU1K52s6n5oEADs=" />
+<img class="intLink" title="Dotted list" onclick="formatDoc('insertunorderedlist');" src="data:image/gif;base64,R0lGODlhFgAWAMIGAAAAAB1ChF9vj1iE33mOrqezxv///////yH5BAEAAAcALAAAAAAWABYAAAMyeLrc/jDKSesppNhGRlBAKIZRERBbqm6YtnbfMY7lud64UwiuKnigGQliQuWOyKQykgAAOw==" />
+<img class="intLink" title="Quote" onclick="formatDoc('formatblock','blockquote');" src="data:image/gif;base64,R0lGODlhFgAWAIQXAC1NqjFRjkBgmT9nqUJnsk9xrFJ7u2R9qmKBt1iGzHmOrm6Sz4OXw3Odz4Cl2ZSnw6KxyqO306K63bG70bTB0rDI3bvI4P///////////////////////////////////yH5BAEKAB8ALAAAAAAWABYAAAVP4CeOZGmeaKqubEs2CekkErvEI1zZuOgYFlakECEZFi0GgTGKEBATFmJAVXweVOoKEQgABB9IQDCmrLpjETrQQlhHjINrTq/b7/i8fp8PAQA7" />
+<img class="intLink" title="Delete indentation" onclick="formatDoc('outdent');" src="data:image/gif;base64,R0lGODlhFgAWAMIHAAAAADljwliE35GjuaezxtDV3NHa7P///yH5BAEAAAcALAAAAAAWABYAAAM2eLrc/jDKCQG9F2i7u8agQgyK1z2EIBil+TWqEMxhMczsYVJ3e4ahk+sFnAgtxSQDqWw6n5cEADs=" />
+<img class="intLink" title="Add indentation" onclick="formatDoc('indent');" src="data:image/gif;base64,R0lGODlhFgAWAOMIAAAAADljwl9vj1iE35GjuaezxtDV3NHa7P///////////////////////////////yH5BAEAAAgALAAAAAAWABYAAAQ7EMlJq704650B/x8gemMpgugwHJNZXodKsO5oqUOgo5KhBwWESyMQsCRDHu9VOyk5TM9zSpFSr9gsJwIAOw==" />
+<img class="intLink" title="Hyperlink" onclick="var sLnk=prompt('Write the URL here','http:\/\/');if(sLnk&&sLnk!=''&&sLnk!='http://'){formatDoc('createlink',sLnk)}" src="data:image/gif;base64,R0lGODlhFgAWAOMKAB1ChDRLY19vj3mOrpGjuaezxrCztb/I19Ha7Pv8/f///////////////////////yH5BAEKAA8ALAAAAAAWABYAAARY8MlJq7046827/2BYIQVhHg9pEgVGIklyDEUBy/RlE4FQF4dCj2AQXAiJQDCWQCAEBwIioEMQBgSAFhDAGghGi9XgHAhMNoSZgJkJei33UESv2+/4vD4TAQA7" />
+<img class="intLink" title="Cut" onclick="formatDoc('cut');" src="data:image/gif;base64,R0lGODlhFgAWAIQSAB1ChBFNsRJTySJYwjljwkxwl19vj1dusYODhl6MnHmOrpqbmpGjuaezxrCztcDCxL/I18rL1P///////////////////////////////////////////////////////yH5BAEAAB8ALAAAAAAWABYAAAVu4CeOZGmeaKqubDs6TNnEbGNApNG0kbGMi5trwcA9GArXh+FAfBAw5UexUDAQESkRsfhJPwaH4YsEGAAJGisRGAQY7UCC9ZAXBB+74LGCRxIEHwAHdWooDgGJcwpxDisQBQRjIgkDCVlfmZqbmiEAOw==" />
+<img class="intLink" title="Copy" onclick="formatDoc('copy');" src="data:image/gif;base64,R0lGODlhFgAWAIQcAB1ChBFNsTRLYyJYwjljwl9vj1iE31iGzF6MnHWX9HOdz5GjuYCl2YKl8ZOt4qezxqK63aK/9KPD+7DI3b/I17LM/MrL1MLY9NHa7OPs++bx/Pv8/f///////////////yH5BAEAAB8ALAAAAAAWABYAAAWG4CeOZGmeaKqubOum1SQ/kPVOW749BeVSus2CgrCxHptLBbOQxCSNCCaF1GUqwQbBd0JGJAyGJJiobE+LnCaDcXAaEoxhQACgNw0FQx9kP+wmaRgYFBQNeAoGihCAJQsCkJAKOhgXEw8BLQYciooHf5o7EA+kC40qBKkAAAGrpy+wsbKzIiEAOw==" />
+<img class="intLink" title="Paste" onclick="formatDoc('paste');" src="data:image/gif;base64,R0lGODlhFgAWAIQUAD04KTRLY2tXQF9vj414WZWIbXmOrpqbmpGjudClFaezxsa0cb/I1+3YitHa7PrkIPHvbuPs+/fvrvv8/f///////////////////////////////////////////////yH5BAEAAB8ALAAAAAAWABYAAAWN4CeOZGmeaKqubGsusPvBSyFJjVDs6nJLB0khR4AkBCmfsCGBQAoCwjF5gwquVykSFbwZE+AwIBV0GhFog2EwIDchjwRiQo9E2Fx4XD5R+B0DDAEnBXBhBhN2DgwDAQFjJYVhCQYRfgoIDGiQJAWTCQMRiwwMfgicnVcAAAMOaK+bLAOrtLUyt7i5uiUhADs=" />
+</div>
+<div id="textBox" contenteditable="true"><p>Lorem ipsum</p></div>
+<p id="editMode"><input type="checkbox" name="switchMode" id="switchBox" onchange="setDocMode(this.checked);" /> <label for="switchBox">Show HTML</label></p>
+<p><input type="submit" value="Send" /></p>
+</form>
+</body>
+</html>
+```
 
 ## 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").
-\ No newline at end of file
+- [`HTMLElement.contentEditable`](/fr/docs/Web/API/HTMLElement/contentEditable)
+- L'attribut universel [`contenteditable`](/fr/docs/Web/HTML/Global_attributes#contenteditable)
+- [`caret-color`](/fr/docs/Web/CSS/caret-color), qui permet de définir la couleur pour le curseur d'insertion de texte
author	SphinxKnight <SphinxKnight@users.noreply.github.com>	2021-12-04 17:38:30 +0100
committer	GitHub <noreply@github.com>	2021-12-04 17:38:30 +0100
commit	530dfca848063fd49ef4b73c169bfb9485e12e85 (patch)
tree	a6f5c70c4c7064ec96bafc71c1c6ee648e734688 /files/fr
parent	e11085ffae53e32944433641373d2e1472b13e1b (diff)
download	translated-content-530dfca848063fd49ef4b73c169bfb9485e12e85.tar.gz translated-content-530dfca848063fd49ef4b73c169bfb9485e12e85.tar.bz2 translated-content-530dfca848063fd49ef4b73c169bfb9485e12e85.zip