七网科技
本页定位
在线咨询

代码高亮Prettify.js通用版

假装绅士🎩3个月前904去下载A+A-

⚠️ © 软件著作权归作者所有;本站所有软件均来源于网络,仅供学习使用,请支持正版!

很多朋友在群里提问代码高亮是如何实现的。简单说一下,使用的是Prettify.js。这是一款 HTML 代码高亮插件,可以让你的网站代码显示更具特色。在我的使用中它不是最优秀的,但是却是非常不错的。光说没用要给大家看看才行。

第一步,引入prettify.js和prettify.css

下载Prettify必要文件

<script src="prettify.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="prettify.css"/>

第二步,在body的onload事件里添加函数onload=”prettyPrint()”

<body onload="prettyPrint()">

第三步,pre标签添加CSS类“prettyprint linenums”

<pre class="prettyprint linenums">${contetn}</pre>

也可以这样,使用js动态添加

$(document).ready(function() {
$(".entry-content pre").addClass("prettyprint linenums");
});

注意:熟悉代码的朋友可以随意折腾,例如把第一步的代码集成到其他js文件,也可以把第二步的代码集成到其他js文件实现加载插件。PRE标签添加class为linenums时,可以显示行号。

资源下载

恭喜,此资源为免费资源,请先

文件版本:V1.0

文件大小:14k

文件语言:js插件

更新日期:2018-9-15

技术交流:QQ群 7717114

相关推荐
全部评论: 0
登录没有账号 切换注册

忘记密码 ?

注册已有账号 切换登录