如何在微信公众号中优雅的显示代码_Prism.js如何在微信公众号中优雅的显示代码 1. 展示 macOS 菜单 icons 2. 代码高亮



如何在微信公众号中优雅的显示代码
  1. 展示 macOS 菜单 icons
  2. 代码高亮

macOS 菜单 icons

  1. css 实现
  2. 背景图

代码高亮

  1. 插件

highlight.js

​https://highlightjs.org/​

​https://github.com/highlightjs/highlight.js​

如何在微信公众号中优雅的显示代码_微信公众号_02

如何在微信公众号中优雅的显示代码_微信公众号_03



Prism.js

​https://prismjs.com/index.html​

​https://github.com/PrismJS/prism/​

如何在微信公众号中优雅的显示代码_Prism.js_04

如何在微信公众号中优雅的显示代码_CSS_05

SyntaxHighlighter

​https://github.com/syntaxhighlighter/syntaxhighlighter​

如何在微信公众号中优雅的显示代码_CSS_06

code-prettify

​https://github.com/googlearchive/code-prettify​

​https://jmblog.github.io/color-themes-for-google-code-prettify/​

demo

​https://mp.weixin.qq.com/s/XvtSns_1xfBNetgVUtNkYg​

如何在微信公众号中优雅的显示代码_Prism.js

复制粘贴页面

copy & paste

如何在微信公众号中优雅的显示代码_代码高亮_08