test/grammar-css.html

<!doctype html>
<html>
    <head>
        
        <meta charset="utf-8">
        
        <link rel="stylesheet" href="codemirror/codemirror.css">
        <link rel="stylesheet" href="codemirror/addon/lint/lint.css">
        <link rel="stylesheet" href="codemirror/addon/hint/show-hint.css">
        <link rel="stylesheet" href="codemirror/addon/fold/foldgutter.css" />
        <style type="text/css">
            body {
                position: relative;
            }

            .CodeMirror {
                margin: 0;
                position: relative;
                width: 100%;
                height: 100%;
                min-width:500px;
                min-height:500px;
            }
        </style>
        
        <script src="codemirror/codemirror.js"></script>
        <script src="codemirror/addon/comment/comment.js"></script>
        <script src="codemirror/addon/lint/lint.js"></script>
        <script src="codemirror/addon/hint/show-hint.js"></script>
        <script src="codemirror/addon/fold/foldcode.js"></script>
        <script src="codemirror/addon/fold/foldgutter.js"></script>
        <!--<script src="codemirror/addon/fold/brace-fold.js"></script>
        <script src="codemirror/addon/fold/comment-fold.js"></script>-->
        <script src="../build/codemirror_grammar.js"></script>
        <script src="grammars/css.js"></script>
        <script src="demo.js"></script>
        
        <title>CodeMirror: Dynamic CSS Grammar Demo</title>
    </head>
    <body>
        
        <h3>CodeMirror (v.<span id="editor-version">0</span>) Grammar (v.<span id="grammar-version">0</span>): Dynamic CSS Grammar</h3>

<textarea id="code" name="code">/* Some example CSS */

@import url("something.css");

body {
  margin: 0; 
  padding: 3em 6em; 
  font-family: tahoma, arial, sans-serif;
  color: #000;
}

#navigation a {
  font-weight: bold;
  text-decoration: none !important;
}

h1 {
  font-size: 2.5em;
}

h2 {
  font-size: 1.7em;
}

h1:before, h2:before {
  content: "::";
}

code {
  font-family: courier, monospace;
  font-size: 80%;
  color: #418A8A;
}</textarea>
        <p></p>

        <script>
        // <![CDATA[
        codemirror_grammar_demo(document.getElementById("code"), [
            {language : "css", grammar : css_grammar}
        ]);
        // ]]>
        </script>
    </body>
</html>