vue 使用v-html绑定时，内部元素不会继承外部css的解决方案

代码：

<div class="content article-html-content" v-html="articleDetailData.details"></div>

样式：

<style scoped>
  .article-html-content p {
    font-size: 16px;
  }
</style>

这样样式不起作用

原因： scoped属性导致css仅对当前组件生效（用css3的属性选择器+生成的随机属性实现的），而html绑定渲染出的内容可以理解为是子组件的内容，子组件不会被加上对应的属性，所以不会应用css

解决方案：

<style>
  .article-html-content p {
    font-size: 16px;
  }
</style>

参考： 博客 (opens new window)