개발/HTML

소스 이쁘게 붙히기(코드미러, 뷰티파이 적용예제)

고니킹 2019. 1. 16. 10:10


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr">
<head>
<link type="text/css" rel="stylesheet" media="all" href="http://minifycode.com/wp-content/themes/minify_code/style.css?v=20150523" />
<link rel='stylesheet' id='codemirror-css'  href='http://minifycode.com/wp-content/themes/minify_code/js-beautify/web/third-party/codemirror/lib/codemirror.css?ver=5.0.3' type='text/css' media='all' />
<script type='text/javascript'>var code_mirror_type = "htmlmixed";</script>
<script type='text/javascript' src='http://minifycode.com/wp-content/themes/minify_code/js-beautify/web/third-party/codemirror/lib/codemirror.js?ver=5.0.3'></script>
<script type='text/javascript' src='http://minifycode.com/wp-content/themes/minify_code/js-beautify/web/third-party/codemirror/mode/xml/xml.js?ver=5.0.3'></script>
<script type='text/javascript' src='http://minifycode.com/wp-content/themes/minify_code/js-beautify/web/third-party/codemirror/mode/htmlmixed/htmlmixed.js?ver=5.0.3'></script>
<script type='text/javascript' src='http://minifycode.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
<script type='text/javascript' src='http://minifycode.com/wp-content/themes/minify_code/js-beautify/js/lib/beautify-html.js?ver=5.0.3'></script>
<script type="text/javascript" src="http://minifycode.com/wp-content/themes/minify_code/js/minify_code.js?v=201504291155"></script>
</head>

<body>

 <div class="wrap">

  <div class="form-item">
   <div class="form_item_right">
    <textarea cols="65" rows="15" id="source" name="html_enter_code" class="enter_code" rel="html_beautify"></textarea>
   <div class="minify_processing">
    <img src="http://minifycode.com/wp-content/themes/minify_code/images/ajax_processing.gif" alt="Processing" /><br /><br />
    <h1>Processing...</h1>
   </div>
  </div>
  <div class="form-item">
   <input type="submit" value="Beautify HTML" class="minify_submit_button beautify_submit" />
   <input type="reset" value="Reset" class="minify_submit_button reset_minify_form" />
  </div>
 </div>

</body>
</html>