vue 在使用v-html綁定的時候，里面的元素不會繼承外部的css，解決方案

問題

想用vue綁定父文本生成的HTML內容，但是發現CSS樣式根本不生效，選擇器沒起作用

代碼：

<div class="announcedetailImg" v-html="detailList.content"></div>

設置樣式：

<style lang="less" scoped>
.announcedetailImg{
    width:100%;
}
.announcedetailImg img{
    width:100% !important;
    display:block;
}
.announcedetailImg p{
    color:#333;
    font-size:16px;
}
    
</style>

這樣之后，發現樣式不起作用

解決方案：

scoped屬性導致css僅對當前組件生效（用css3的屬性選擇器+生成的隨機屬性實現的），而html綁定渲染出的內容可以理解為是子組件的內容，子組件不會被加上對應的屬性，所以不會應用css.

解決的話把scoped屬性去掉就行了