自己的优化点供大家参考：图片预览,代码背景色,标题下划线等

[xiaoMzjm]

感谢作者，自己的优化点大家参考。

图片预览

1. 在wemark.wmxl中，找到image标签，添加属性bindtap="wemarkTabImage"
2. 然后wemark.js中的methods中增加函数：

      wemarkTabImage(e){
        wx.previewImage({
          current: e.currentTarget.dataset.src, // 当前显示图片的http链接
          urls: [e.currentTarget.dataset.src] // 需要预览的图片http链接列表
        })
      }

代码背景颜色

1. 在wemark.wxss中，找到wemark_block_code，调整background-colo，我调整成黑色#2b2b2b
2. 调整其他一些字体为白色：例如注解wemark_inline_code_annotation，调整color:#e0e0e0;
3. 看下其他哪些字体比较黑看不到，自己调下

一级标题

1. 不喜欢标题居中，把居中去掉
2. 字体调大加粗
3. 增加伪元素，加下划线

.wemark_block_h1{
  font-size:50rpx;
  /**不喜欢居中，把居中去掉**/
  /**text-align: center;**/
  margin-bottom:1em;
  margin-top:40px;
  font-weight: 500;
  // 为伪元素而新增的position属性
  position: relative;
}
.wemark_block_h1:after{
  content: '';                 /*CSS伪类用法*/
  position: absolute;         /*定位背景横线的位置*/
  top: 130%;
  background: #e0e0e0;       /*宽和高做出来的背景横线*/
  width: 100%;
  height: 1px;
  left:0px;
}

效果：
代码颜色：

一级目录：

图片预览：

[xiaoMzjm]

字体高亮，微调了颜色，左右间距，圆角

.wemark_inline_code{
	background:#edebed;
	padding:3px 5px;
	word-wrap:break-word;
  border-radius:5px;
  margin-left:5px;
  margin-right:5px;
}

效果：

[ZhuPeng]

黑色背景要好看些，借鉴了

From WeChat Mini Programe: GitHub Trending Hub

[haiw2sm]

我想问一下能发一下你的demo吗 我的为什么没有高亮而且图片也没有显示

[dcalsky]

我想问一下能发一下你的demo吗 我的为什么没有高亮而且图片也没有显示

You should append data-src="{{renderInline.src}}" into the Image element in wemark.html