richeditor.html 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <div id="word-count-wrapper" style="display:none">
  2. Words: <span id="word-count"></span> Characters: <span id="character-count"></span>
  3. </div>
  4. <div id="editor">
  5. <h1>Rich editor (h1)</h1>
  6. <p>
  7. This editor features exceptionally high number of plugins.
  8. </p>
  9. <p>
  10. It
  11. <strong>features</strong>
  12. <em>some basic</em>
  13. <s>font</s>
  14. <sub>styling &mdash;</sub>
  15. <sup>nothing</sup>
  16. <u>too crazy</u>.
  17. <a href="https://ckeditor.com">Links</a> are also here.
  18. </p>
  19. <p>
  20. Font can have customized
  21. <span style="background-color:#e6e64c">background</span>,
  22. <span style="color:#ff0000">foreground</span>,
  23. <span style="font-family:'Trebuchet MS', Helvetica, sans-serif">font face</span>,
  24. <span class="text-big">height</span>.
  25. You can also <mark class="marker-yellow">mark</mark> it or use <code>code</code> if you want to.
  26. </p>
  27. <p style="text-align:right">
  28. Text alignment can be customized.
  29. </p>
  30. <ol>
  31. <li>Ordered list
  32. <ol>
  33. <li>Ordered list</li>
  34. </ol>
  35. </li>
  36. </ol>
  37. <ul>
  38. <li>Unordered list
  39. <ul>
  40. <li>Unordered list</li>
  41. </ul>
  42. </li>
  43. </ul>
  44. <ul>
  45. <li><input type="checkbox">To-do list item 1</li>
  46. <li><input type="checkbox" checked="checked">To-do list item 2</li>
  47. <li><input type="checkbox">To-do list item 3</li>
  48. </ul>
  49. <p style="margin-left:40px">Indenting a paragraph is fine too.</p>
  50. <blockquote>
  51. An example blockquote text.
  52. </blockquote>
  53. <table>
  54. <tbody>
  55. <tr>
  56. <td>cell</td>
  57. <td>cell</td>
  58. </tr>
  59. <tr>
  60. <td>cell</td>
  61. <td>cell</td>
  62. </tr>
  63. </tbody>
  64. </table>
  65. <figure class="media">
  66. <oembed url="https://www.youtube.com/watch?v=CB70skVw3nU"></oembed>
  67. </figure>
  68. <pre><code class="language-xml">&lt;blockquote&gt;
  69. An example blockquote text.
  70. &lt;/blockquote&gt;</code></pre>
  71. <p>Time to separate it with a horizontal rule, followed by a page break:</p>
  72. <hr>
  73. <div class="page-break" style="page-break-after:always;"><span style="display:none;">&nbsp;</span></div>
  74. <p>There is a possibility to work with the restricted editing plugin: <span class="restricted-editing-exception">Like that</span>.</p>
  75. </div>