prism代码高亮插件

 查看演示  website  立即下载

先引入这两个文件

<link rel="stylesheet" href="css/prism.css">
<script src="js/prism.js"></script>

此时创建pre和code就可以了

<pre class="line-numbers">
          <code class="language-markup">
      		&lt;pre class="line-numbers"&gt;
      		    &lt;code class="language-markup"&gt;
      				&lt;style&gt;
      				   .div{ width : 100px }
      				&lt;/style&gt;
      		    &lt;/code&gt;
      		&lt;/pre&gt;
          </code>
      </pre>

详细请看里面的实例

PREVIOUS:
NEXT:
vue.js表单登录tab切换
js和CSS3炫酷图片画廊插件