How to add css to vue.js v-html rendered dom

the html code rendered by v-html has img, but does not set width and height. All pictures are displayed according to their own size, and the page is made ugly by pictures. I hope to add a fixed width and high style to the img tag

Mar.04,2021

v-html belongs to some div, right?
so img is the descendant element of div.
can't you define the style in advance?

.selector img{
    xxx
}

or you can get the ref, of the bound div of v-html and add css to the img in it by getting nodes


first, you need to define a style class for the image, and then when rendering, bind the style class you defined to a specific tag by using : class


.

add / deep/ (depth action selector) style name / signature {style content} before the tag you want to add

https://vue-loader.vuejs.org/.


style tags cannot be scoped. Otherwise, the v-html rendering style will be modified with invalid


template:
< p class= "informationContent" vmurhtml = "item.informationContent" >

sytle:
.informationContent > img
height 50px
width 50px

I solved it in this way. I don't know if I can help people


write a class or id, on the v-html node, such as class= "vhtml", and then set the width and height of the picture
.vhtml img {width:100px;height:100px;}

in style.
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-7b9334-269dd.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-7b9334-269dd.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?