相关疑难解决方法(0)

Vuetify - CSS在组件内部不起作用(生效)

案例1
我们正在尝试将自定义样式应用于渲染的vuetify元素:

<template>
    <v-text-field v-model="name" label="Name" />
</template>

<style scoped>
.input-group__input {
    background: red;
}
</style>
Run Code Online (Sandbox Code Playgroud)

但没有变化.


案例2
我们正在尝试设置由v-html(例如外部html)呈现的元素的样式.例如,我们尝试在其上应用自定义宽度和高度img,但它不起作用:

<template>
    <div v-html="customHTML"></div>
</template>

<script>
export default {
    data: () => ({
        customHTML: `<img src="https://vuetifyjs.com/static/doc-images/carousel/planet.jpg">`;
    })
}
</script>

<style scoped>
img {
    width: 200px;
    height: 200px;
}
</style>
Run Code Online (Sandbox Code Playgroud)

如何将自定义CSS应用于这些元素?

vuetify.js

14
推荐指数
1
解决办法
2万
查看次数

标签 统计

vuetify.js ×1