save-back-ex-003-content-editable.html

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  <title>Editable Text in HTML</title>
</head>
<body style="background:lightgrey;">
<p>A happenstance use of <a href="https://addons.mozilla.org/en-US/firefox/addon/save-back-to-file-from-dom/">https://addons.mozilla.org/en-US/firefox/addon/save-back-to-file-from-dom/</a>.</p>
<p>Store this page on (save to) your local file system (disk) and open from there to try out.</p>
<p>Click text in below white <code>&lt;div</code>, edit,
then <a href="https://addons.mozilla.org/en-US/firefox/addon/save-back-to-file-from-dom/">save
back to file</a>.</p>
<div contenteditable="true" style="background:white;padding:5px 10px;border-style:solid;border-color:darkgrey;">
<p>A paragraph.</p>
<ul><li>A list item.</li>
<li>Another list item.</li></ul>
<pre># some preformatted text

&lt;p&gt;Hello world!&lt;/p&gt;

console.log("Hello world!");</pre>
</div>
<p>Editing features you are experiencing on this page are courtesy of your browser,
<code>contenteditable="true"</code>.</p>
</body>
</html>