mixedtest.html 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <script src="js/codemirror.js" type="text/javascript"></script>
  4. <title>CodeMirror: HTML mixed-mode demonstration</title>
  5. <link rel="stylesheet" type="text/css" href="css/docs.css"/>
  6. </head>
  7. <body style="padding: 20px;">
  8. <p>This is a simple demonstration of the HTML mixed-mode indentation
  9. module for <a href="index.html">CodeMirror</a>. Script tags use the JS
  10. parser, style tags use the CSS parser.</p>
  11. <div style="border: 1px solid black; padding: 3px;">
  12. <textarea id="code" cols="120" rows="30">
  13. &lt;html>
  14. &lt;head>
  15. &lt;title>HTML Example&lt;/title>
  16. &lt;script type="text/javascript">
  17. function foo(bar, baz) {
  18. alert("quux");
  19. return bar + baz + 1;
  20. }
  21. &lt;/script>
  22. &lt;style type="text/css">
  23. div.border {
  24. border: 1px solid black;
  25. padding: 3px;
  26. }
  27. #foo code {
  28. font-family: courier, monospace;
  29. font-size: 80%;
  30. color: #448888;
  31. }
  32. &lt;/style>
  33. &lt;/head>
  34. &lt;body>
  35. &lt;p>Duh&lt;/p>
  36. &lt;/body>
  37. &lt;/html>
  38. </textarea>
  39. </div>
  40. <script type="text/javascript">
  41. var editor = CodeMirror.fromTextArea('code', {
  42. height: "350px",
  43. parserfile: ["parsexml.js", "parsecss.js", "tokenizejavascript.js", "parsejavascript.js", "parsehtmlmixed.js"],
  44. stylesheet: ["css/xmlcolors.css", "css/jscolors.css", "css/csscolors.css"],
  45. path: "js/"
  46. });
  47. </script>
  48. </body>
  49. </html>