嵌套在有序列表中的无序列表在vuejs应用程序中没有给出预期的结果

Question

如何在vue 2中的有序列表中嵌套无序列表？？我试过

<template>
<div class="p-14">
<ol class="numberlist">
<li>An numbered list</li>
<li>Containing
<ul class="sqaredotlist">
<li>A dotted list</li>
<li>Containing
<ol class="romanlist">
<li>A roman numeral list</li>
<li>And some items</li>
<li>Like this</li>
</ol>
</li>
<li>And some items</li>
<li>Like this</li>
</ul>
</li>
<li>And some items</li>
<li>Like this</li>
</ol>
</div>
</template>
<script>
export default {
}
</script>
<style scoped>
ol.numberlist {
list-style-type: decimal;
}
ul.sqaredotlist {
list-style-type: square;
}
ol.romanlist {
list-style-type: lower-roman;
}
</style>

但这让我明白了。看起来无序的元素被解释为有序的。

1. An numbered list.
2. Containing
1. A dotted list
2. Containing
1. A roman numeral list
2. And some items
3. Like this
3. And some items
4. Like this
3. And some items
4. Like this

如果没有css类，我会得到同样的结果。如果有人知道如何在有序列表中嵌套无序列表，请帮助我！！

Answer 1

也许目录中的另一个文件正在影响此Vue文件。您的项目中是否有"全局"样式表？也许样式表上写着：

li {
list-style-type: decimal !important;
}