markdownxiaoshujiang icon indicating copy to clipboard operation
markdownxiaoshujiang copied to clipboard

「bug」复制微信公众号 列表 样式显示问题

Open BluerAngala opened this issue 3 years ago • 1 comments

问题:小书匠预览复制到微信公众号时,对于列表的显示格式存在问题,莫名出现缩进。

根源:小书匠默认生成 html 存在 ol 、li 标签,在微信公众号中对于此类标签会设置自定义编号和缩进,导致格式显示错误。

改进:建议在「复制到微信公众号」功能中,设置生成的 html 中的 li 标签改为 span


小书匠正常显示: 小书匠正常显示

微信公众号出现缩进: 微信公众号出现缩进

源码分析: 源码分析

BluerAngala avatar Feb 03 '22 03:02 BluerAngala

可以先自定义 css 样式(设置>预览>自定义 css样式)解决下,后继版本我再把这个样式默认添加上去。

.xsj_plugin_wechat .footnotes-list{
   text-align: left;
   margin-left: -2.2em!important;
   list-style-position: inside;
}
.xsj_plugin_wechat .footnote-item{
   text-align: left;
}
.xsj_plugin_wechat .footnotes-list .footnote-item>p{
  display: inline;
}

对于把 li 改成 span, 因为这些样式是可以通过 css 来调整回来的,所以暂时就不这样处理了。

suziwen avatar Feb 04 '22 06:02 suziwen