index.html 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <title>CodeMirror 2: HTML mixed mode</title>
  5. <link rel="stylesheet" href="../../lib/codemirror.css">
  6. <script src="../../lib/codemirror.js"></script>
  7. <script src="../xml/xml.js"></script>
  8. <script src="../javascript/javascript.js"></script>
  9. <script src="../css/css.js"></script>
  10. <link rel="stylesheet" href="../../theme/default.css">
  11. <script src="htmlmixed.js"></script>
  12. <link rel="stylesheet" href="../../css/docs.css">
  13. <style>.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
  14. </head>
  15. <body>
  16. <h1>CodeMirror 2: HTML mixed mode</h1>
  17. <form><textarea id="code" name="code">
  18. <html style="color: green">
  19. <!-- this is a comment -->
  20. <head>
  21. <title>Mixed HTML Example</title>
  22. <style type="text/css">
  23. h1 {font-family: comic sans; color: #f0f;}
  24. div {background: yellow !important;}
  25. body {
  26. max-width: 50em;
  27. margin: 1em 2em 1em 5em;
  28. }
  29. </style>
  30. </head>
  31. <body>
  32. <h1>Mixed HTML Example</h1>
  33. <script>
  34. function jsFunc(arg1, arg2) {
  35. if (arg1 && arg2) document.body.innerHTML = "achoo";
  36. }
  37. </script>
  38. </body>
  39. </html>
  40. </textarea></form>
  41. <script>
  42. var editor = CodeMirror.fromTextArea(document.getElementById("code"), {mode: "text/html", tabMode: "indent"});
  43. </script>
  44. <p>The HTML mixed mode depends on the XML, JavaScript, and CSS modes.</p>
  45. <p><strong>MIME types defined:</strong> <code>text/html</code>
  46. (redefined, only takes effect if you load this parser after the
  47. XML parser).</p>
  48. </body>
  49. </html>