Loading... <p>具体的方法是通过引用prism.js及prism.css实现，而不是PHP代码或者第三方插件来实现语法高亮。</p><p>在说使用教程之前咱们来看下prism.js的优点：</p><ol><li>极致易用：引用 prism.css 和 prism.js，使用合适的 HTML5 标签（code.language-xxxx），搞定！</li><li>天生伶俐：语言的 CSS 类是可继承的，所以你只需定义一次就能应用到多个代码片段。</li><li>轻如鸿毛：代码压缩后只有 1.6KB。每添加一个语言平均增加 0.3-0.5KB，主题在 1KB 左右。</li><li>快如闪电：如果可能，支持通过 Web Workers 实现并行。</li><li>轻松扩展：定义新语言或扩展现有语法，或者新增功能都非常简单。</li><li>丰富样式：所有的样式通过 CSS 完成，并使用合理的类名如：.comment, .string, .property 等。</li></ol><p>很简单，教程如下：</p><p>1，首先进入prism.js的官网（<span class="external-link"><a class="no-external-link" href="https://prismjs.com/" target="_blank">点击进入<i data-feather='external-link'></i></a></span>），点击Dowload，如图：<br><span class="external-link"><a class="no-external-link" href="https://cdn2.cuifangchao.com/www.cuifangchao.com/img/005BYqpgly1g236cb6qkdj30sz0ctdmx.jpg" target="_blank"><img src="https://cdn2.cuifangchao.com/www.cuifangchao.com/img/005BYqpgly1g236cb6qkdj30sz0ctdmx.jpg" alt="" title=""><i data-feather='external-link'></i></a></span></p><p>2，进入下载页面。在下载页面中选中你想要实现语法高亮的语言,因为不是很大，我是全选的，懒得自己去找了。如图：<br><img src="https://cdn2.cuifangchao.com/www.cuifangchao.com/img/005BYqpggy1g236cag11kj30o10jaadk.jpg" alt="005BYqpggy1g236cag11kj30o10jaadk.jpg" title="005BYqpggy1g236cag11kj30o10jaadk.jpg"></p><p>3，点击按钮下载js及css，如图：<br><img src="https://cdn2.cuifangchao.com/www.cuifangchao.com/img/005BYqpgly1g236cthab7j30tl0dzmza.jpg" alt="005BYqpgly1g236cthab7j30tl0dzmza.jpg" title="005BYqpgly1g236cthab7j30tl0dzmza.jpg"></p><p>4，下载之后你可以上传到你的服务器里面，然后去你模版的head.php引用就可以啦，如图：<br><img src="https://cdn2.cuifangchao.com/www.cuifangchao.com/img/005BYqpggy1g236j3rzloj30lx020glm.jpg" alt="005BYqpggy1g236j3rzloj30lx020glm.jpg" title="005BYqpggy1g236j3rzloj30lx020glm.jpg"></p><p>ps：<br>引用代码如下，改成自己的路径就可以了，</p><pre><code class="lang-html"><link rel="stylesheet" href="https://你存放的路径/css/prism.css" type="text/css"/> <script src="https://你存放的路径/js/prism.js"></script></code></pre> 最后修改：2019 年 04 月 30 日 11 : 58 AM © 允许规范转载 赞赏 如果觉得我的文章对你有用，请随意赞赏 ×Close 赞赏作者 扫一扫支付 支付宝支付 微信支付
