This text should be started on the second page.

Technical Notes for this page style

• Basic styles implementation.
• Page design.
• Multi-column and media-query css with css3.
• prefix-free for cross-browser css3 support.
• On WebKit-based/Chrome a custom scroller is designed.
• Syntax highlighting(and code editor) implemented with ACE.
• MathJax $\LaTeX$ support.

Syntax Highlighting Example

basic example

<pre class="codehlt" data-mode="ace/mode/html" data-height="100px" data-width="900px">
</pre>

theme/mode support

<pre class="codehlt" data-mode="ace/mode/javascript" data-theme="ace/theme/monokai"
   data-height="200px" data-width="900px">function square(a){
   return a*a;
}</pre>

function square(a){
   return a*a;
}

editable

//this code is editable,enabled with attribute data-edit="edit"
function square(a){
   return a*a;
}

more configurations

//this code is editable,enabled with attribute data-edit="edit"
//use data-ace_conf="json" to set more configurations
//here we used "tabStop":8
function square(a){
	return a*a;
}

What if...USE the space but delay rendering?

//editable:)
function square(a){
	return a*a;
}
//CLICK to render;;;

Use $\LaTeX$ with MathJax

And.. $\LaTeX ~~\mathtt{enabled}$. $LaTeX$ for MathJax.