Modify the style of the tr tag directly:
<style scope>
/deep/ tr {
background-color: red;
}
</style>
Remember to add scope /deep/ in the style tag
as a pseudo-class to solve the problem of CSS style scope, which is very effective for solving style conflicts between different components
It should be noted that the /deep/ pseudo-class is currently deprecated, and it is recommended to use ::v-deep or >>> instead. For example:
/* 父组件的样式 */
.parent ::v-deep .child button {
background-color: red;
}
or
/* 父组件的样式 */
.parent >>> .child button {
background-color: red;
}
In addition:
It should be noted that the use of the /deep/ pseudo-class is also globally effective and may affect other components, so it needs to be used with caution in actual development. It is recommended to use the class name selector to limit the scope of the style.