雞西網站建設制作優化設計[SEO]
本頁定位
在線咨詢

代碼高亮Prettify.js通用版

假裝紳士??1年前 (2018-09-14)1510去下載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

系統要求:OS X 10.9 或更高版本

技術交流:QQ群 7717114

全部評論: 0
登錄沒有賬號 切換注冊

忘記密碼 ?

注冊已有賬號 切換登錄

15选5走势图开奖