<pre class="line-number" data-codetype="HTML"><code>Codigo  HTML</code></pre><p>&nbsp;</p><pre class="line-number" data-codetype="CSS"><code>Codigo CSS </code></pre><!-- syntax mulai --><script src="http://bloggertut.googlecode.com/svn/trunk/js/highlight.pack.js">// <![CDATA[<script>     hljs.initHighlightingOnLoad();// ]]></script><!-- syntax selesai -->

<style type="text/css"><!--
/* Syntax Highlghter 
By: Kang Ismet - www.blog.kangismet.net --------- */
pre {padding:.8em 1em;margin:0;background-color:#000;
 border-left:4px solid #40627E;font-size:22px;
 color:#000000;
 font-family:  "Edwardian Script ITC";
 line-height:1.4em;position:relative;white-space:
 pre-wrap;word-wrap: normal;}
pre.line-number {background:#fff url(http://smayli.ru/data/smiles/ulibki-140.gif)no-repeat top left;padding-left:73px;border-left:none;}
pre.line-number:after{content:"";
 width:35px;height:8px;background-color:#E0E0E0;bottom:0;
 left:0;position:absolute;}
pre[data-codetype="CSS"]{border-left-color:#B3B3B3}
pre[data-codetype="HTML"]{border-left-color:#B3B3B3}
pre[data-codetype="JavaScript"]{border-left-color:#B3B3B3}
pre[data-codetype="JQuery"]{border-left-color:#B3B3B3}
pre.line-number[data-codetype]:before {content:attr(data-codetype);display:block;margin:-11px -13px 10px -54px;padding:8px 12px;font-family:Edwardian Script ITC;font-size:24px;text-transform:uppercase;background-color:#fff;color:#000}
pre.line-number[data-codetype="CSS"]:before{background-color:#F59EC8}
pre.line-number[data-codetype="HTML"]:before{background-color:#9DDDF4}
pre.line-number[data-codetype="JavaScript"]:before{background-color:#D0E6F1}
pre.line-number[data-codetype="JQuery"]:before{background-color:#D0E6F1}
code {font-family: "Edwardian Script ITC";font-size:24px;color: #000;}
#comments code {color:#000;}
pre code {padding:0 !important;color: #a3a49a;background: none !important;border:none !important;display:block; }
pre .line-number {float:left;margin:0 1em 0 -1em;color:#000;background-color:#000;text-align:right;min-width:2.5em;padding-right:4px;}
pre .comment,
pre .template_comment,
pre .diff .header,
pre .doctype,
pre .pi,
pre .lisp .string,
pre .javadoc {color: #000;font-style: Edwardian Script ITC;}
pre .keyword,
pre .winutils,
pre .method,
pre .addition,
pre .css .tag,
pre .request,
pre .status,
pre .nginx .title {color: #E19EF5;}
pre .number,
pre .command,
pre .string,
pre .tag .value,
pre .rules .value,
pre .phpdoc,
pre .tex .formula,
pre .regexp,
pre .hexcolor {color: #F5B59E;}
pre .title,
pre .localvars,
pre .chunk,
pre .decorator,
pre .built_in,
pre .identifier,
pre .vhdl .literal,
pre .id,
pre .css .function {color: #9EF5CB;}
pre .attribute,
pre .variable,
pre .lisp .body,
pre .smalltalk .number,
pre .constant,
pre .class .title,
pre .parent,
pre .haskell .type {color: #9DDDF4;}
pre .preprocessor,
pre .preprocessor .keyword,
pre .shebang,
pre .symbol,
pre .symbol .string,
pre .diff .change,
pre .special,
pre .attr_selector,
pre .important,
pre .subst,
pre .cdata,
pre .clojure .title,
pre .css .pseudo {color: #B2F59E;}
pre .deletion {color: #F5B59E;}
pre .tex .formula {background: #F5B59E;
}
--></style>