vue中使用v-html渲染html增加样式，＞＞＞样式不生效问题

要想渲染富文本，只需要v-html绑定html文本即可： 

但是会发现里面的img图片会溢出盒子：

 经过百度发现，是没有加上样式，这个原因很简单，HTML样式问题；知道原因，那么修改样式啊；起初是直接在 style 里面写相应的样式，卵用没有； 网上搜索了一下，发现有老哥也是遇到了这个问题，同时结合官方说法，说是使用 scoped后，父组件的样式将不会渗透到子组件中。从而造成这个问题，但是不使用scoped，又会造成css的污染；不过vue的深度作用选择器来了，如果你希望 scoped样式中的一个选择器能够作用得“更深”，例如影响子组件，你可以使用 >>>操作符，可以解决这一问题；

要给v-html增加样式的方法:

.body >>> img {
  width: 100%;
  object-fit: fill;
}

但是还没有出现效果，这是因为有些像 lang="scss"之类的预处理器无法正确解析，>>>会不起作用，这种情况下你可以使用 /deep/操作符取而代之——这是一个 >>>的别名，同样可以正常工作。

.body ::v-deep img {
  width: 100%;
  object-fit: fill;
}

然后你会发现有效果了：