francis
/
amber
forked from amber/amber


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
							<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>CodeMirror: Close-Tag Demo</title>
    <link rel="stylesheet" href="../lib/codemirror.css">
    <script src="../lib/codemirror.js"></script>
    <script src="../addon/hint/show-hint.js"></script>
    <link rel="stylesheet" href="../addon/hint/show-hint.css">
    <script src="../addon/edit/closetag.js"></script>
    <script src="../addon/hint/html-hint.js"></script>
    <script src="../mode/xml/xml.js"></script>
    <script src="../mode/javascript/javascript.js"></script>
    <script src="../mode/css/css.js"></script>
    <script src="../mode/htmlmixed/htmlmixed.js"></script>
        
    <link rel="stylesheet" href="../doc/docs.css">
    <style type="text/css">
      .CodeMirror {border-top: 1px solid #888; border-bottom: 1px solid #888;}
    </style>
  </head>
  <body>
    
    <h1>HTML5 code completation demo</h1>
    <ul>
      <li>Type an html tag. If you press Ctrl+Space a hint panel show the code suggest. You can type to autocomplete tags, attributes if your cursor are inner a tag or attribute values if your cursor are inner a attribute value.</li>
    </ul>

    <form><textarea id="code" name="code">
<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="utf-8">
    <title>Home - W2S Web IDE</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
  </head>
  
  <body>
    
    <div class="container">
      
      <div class="masthead">
        <h3 class="muted">HTML5 Autocomplete</h3>
        <div class="navbar">
          <div class="navbar-inner">
            <div class="container">
              <ul class="nav">
                <li class=" active "><a href="#">Home</a></li>
                <li class=""><a href="#">Features</a></li>
                <li class=""><a href="#">Sign In</a></li>
              </ul>
            </div>
          </div>
        </div><!-- /.navbar -->
      </div>
      
      <!-- Jumbotron -->
      <div class="jumbotron">
        <img src="/Images/w2s.png" />
        <h1>W2S Cloud IDE</h1>
      </div>
      
      <hr>
      
      
      <hr>
      
      <div class="footer">
        Final of html5 autocomplete
      </div>
      
    </div> <!-- /container -->
  </body>
</html>

</textarea></form>
    <script type="text/javascript">
      CodeMirror.commands.autocomplete = function(cm) {
          CodeMirror.showHint(cm, CodeMirror.htmlHint);
      }
        
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        mode: 'text/html',
        autoCloseTags: true,
        extraKeys: {"Ctrl-Space": "autocomplete"}
      });
    </script>
  </body>
</html>