很多时候依赖插件都是很不好的，经常会有冲突的情况，然后又想用好看整洁的代码高亮怎么办呢？

下面教大家非插件实现代码高亮，也非常简单。

效果可以看本站的，

把下面的代码加入到echo_log.php文件中：

<!-- 代码高亮 -->  <script src="https://qiquanji.com/content/templates/5i/js/prettify.js?ver=2.1" type="text/javascript"></script>  <script type="text/javascript">  $(function() {  $('pre').addClass('prettyprint linenums').attr('style', 'overflow:auto');  window.prettyPrint && prettyPrint();  });  </script>

然后把下面这段css代码加入到模板引用的css文件即可：

.prettyprint,  pre.prettyprint {      background-color: #272822;      border: 1px solid #272822;      overflow: hidden;      padding: 8px;  }  .prettyprint.linenums,  pre.prettyprint.linenums {  	-webkit-box-shadow: inset 40px 0 0 #39382E, inset 41px 0 0 #464741;  	-moz-box-shadow: inset 40px 0 0 #39382E, inset 41px 0 0 #464741;  	box-shadow: inset 40px 0 0 #39382E, inset 41px 0 0 #464741;  }  .prettyprint.linenums ol,  pre.prettyprint.linenums ol {      margin: 0 0 0 33px;   }  .prettyprint.linenums ol li,  pre.prettyprint.linenums ol li {      padding-left: 12px;  	color: #bebec5;  	line-height: 20px;  	margin-left: 0;  	list-style: decimal;  }  .prettyprint .com { color: #93a1a1; }  .prettyprint .lit { color: #AE81FF; }  .prettyprint .pun,  .prettyprint .opn,   .prettyprint .clo { color: #F8F8F2; }  .prettyprint .fun { color: #dc322f; }  .prettyprint .str,   .prettyprint .atv { color: #E6DB74; }  .prettyprint .kwd,   .prettyprint .tag { color: #F92659; }  .prettyprint .typ,   .prettyprint .atn,   .prettyprint .dec,   .prettyprint .var { color: #A6E22E; }  .prettyprint .pln { color: #66D9EF; }

本站声明:网站内容来源于网络,如有侵权,请联系我们https://www.qiquanji.com,我们将及时处理。