鸡西网站建设制作优化设计
本页定位
在线咨询

代码高亮Prettify.js通用版

假装绅士🎩1个月前412去下载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时,可以显示行号。

资源下载

隐藏内容:******,购买后可见!

下载价格:0 大洋

您需要先后,才能购买资源

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

忘记密码 ?

注册已有账号 切换登录