v-html ol ul 样式_v-html ul,ol

1、v-html 使用配合富文本编辑器 ol ul 没有样式问题

1、目前的框架，大部分会把 ol ul li 下的pading 给重置为 0 和 line-style: none;
所以需要重新给 ol ul li 下赋予样式

2、如果是在单 vue 文件下 style 使用 scoped 会对样式也不会起作用。这个时候，需要把 scoped 给去掉。
组件通过 bem 命名的的方式，再写样式。这里ul ol 的 li 要分开 案例如下

<template>
    <div class="rich-text_content"">
        <div v-html="content.text">
        </div>
    </div>
</template>


<style lang="scss">
.rich-text_content {
    ul ,ul li  { list-style-type: inherit; }
    ol{ list-style-type: decimal}
    ol li  { list-style-type: inherit; }
    ul, ol { padding-left: 20px; }
}

</style>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18