Code Pretty
We use google-code-prettify to customize our style.

jQuery & CSS

<link type="text/css" rel="stylesheet" href="http://www.25sprout.com/25lab/prettyPrint/css/prettify.css" >
<script type="text/javascript" src="http://www.25sprout.com/25lab/prettyPrint/js/prettify.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		prettyPrint();
	});
</script>

Html

寫教學文的時候,如果需要貼上程式碼,可以將程式碼貼在 <pre></pre> 裡面,但是要記得把你裡面程式碼中的 左右大小於符號,換成編碼。

並且在 pre 的 tag 加上 prettyprint linenums 的 class 就可以有下方的 style 模樣。

// Please change '<' to '&lt;' Also change '>' to '&gt;'
<pre class="prettyprint linenums" >
	//也可以有註解;
	&lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /&gt;
	&lt;meta name="description" content="" /&gt;
	&lt;meta name="keywords" content="" /&gt;
	&lt;?php 
		//也可以有 PHP
		echo "hihi";
	?&gt;
</pre >

Result

//也可以有註解;
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<?php 
	//也可以有 PHP
	echo "hihi";
?>