前端开发中常见框架为vue、react、angular及原生html方式开发，本篇文章介绍在vue框架中关于v-html渲染后的图片问题。

v-html指令：可以直接将字符串渲染为HTML内容。

在实际开发中你会发现当使用v-html渲染HTML文件后，通过css控制不了富文本中内容。那么关于该问题要如何处理呢？

一、style中去掉scoped

    vue设置style标签可以配置属性scoped。但配置该属性后它的CSS样式只能作用于当前组件。进而避免了组件之间的样式被相互污染。

    由上述关于style标签scoped属性的描述可知，将scoped属性去掉即可关闭样式只应用该组件。

二、使用样式穿透

    如果你当前组件的样式只需要在该组件中应用，就需要用到样式穿透对指定class进行样式设置。

<template>
	<div class="details_content" v-html="content"></div>
</template>
::v-deep .details_content{
	img{
		width: 100% !important;
	}
}

::v-deep样式穿透保险且编译速度更快