layui和editormd冲突问题

作者: xahy 分类: 笔记 发布时间: 2019-07-24 20:26

在写的后台静态页面,

基本框架使用的是layui。

发现 editormd 这个 Markdown 编辑器非常不错,

于是准备集成到文章新增功能里面,

但是在集成的时候发现了几个问题。

  • 无序列表不显示前面的符号
  • 有序列表不显示前面的数字
  • 多语言风格代码块无法选择代码语言(不显示选择项)

这是因为引入的 layui 框架 layui.css 中对这些元素做了 none 隐藏

  • 无序列表不显示前面的符号问题所在
li {
list-style: none;
}

 

  • 有序列表不显示前面的数字问题所在
li {
list-style: none;
}

 

  • 多语言风格代码块无法选择代码语言 问题所在
.layui-form input[type="checkbox"], .layui-form input[type="radio"], .layui-form select {
display: none;
}

 

针对上面的问题,

只需要在引入编辑器的页面,

添加css

<style>
    .layui-form select{display: inline;}
    ul li {
        list-style: circle;
    }
    ol li {
        list-style: decimal;
    }
</style>

 

即可正常显示。

发表评论

电子邮件地址不会被公开。 必填项已用*标注