<span v-html="ExhibitionData.content" id="Content"></span></li>

不能直接在 <style></style> 中修改css样式 这应该是vue中虚拟dom渲染的元素无法修改样式;

方法1:在updated生命周期函数中,js动态配置样式(这里引入了jQ,可以用原生js更改样式)

updated(){
          $('#Content').find('img').css('width', '100%')
        },

方法2:去掉style标签中的scoped属性!(注意类名一样会污染全局样式,用时慎重)

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

方法3:写样式的时候添加>>>

<style scoped>
#Content >>>  img{
   width: 100%;
}
</style>

修改后: 

Logo

前往低代码交流专区

更多推荐