深度选择器 >>> 解决v-html渲染的页面 元素无法修改样式的问题

深度选择器>>>,可深度改变子级样式。

记录链接https://www.jianshu.com/p/fed3d2be9783

<template>
    <div class="test">
        <div v-html="htmlcode"></div>
    </div>
</template>

<script>
   export default {
      data() {
         return {
            htmlcode: "<img src='./demo.jpg'>"
         }
      }
   }
</script>

<style scoped>
    .test >>> img{
        width: 100%;
    }
</style>

修改v-html绑定的html片段中<img>标签的宽度为100%

posted @ 2019-08-20 16:16  秋风2016  阅读(546)  评论(0编辑  收藏  举报