Vuetify:外部页面 CSS 破坏了 Vuetify 的组件样式

问题描述

使用 Vuitify 组件创建了一个 Vue 小部件.在开发模式下，一切正常.但是当widget插入到站点页面时，页面CSS破坏了Vuetify的组件样式.

Created a Vue widget with Vuitify components. In development mode everything worked fine.But when the widget inserted on the site page, the page CSS breaks Vuetify's component style.

例如?Vuetify 日期选择器:在此处输入图片描述

For exmple? Vuetify datepicker:enter image description here

我尝试使用范围样式vuetify/dist/vuetify.min.css"它，但没有帮助.

I tried to use scoped style "vuetify/dist/vuetify.min.css" it, but it did not help.

<template>
  <v-app>
    <v-content>
    <router-view></router-view>
  </v-content>
  </v-app>
</template>

<script>
</script>
<style scoped src="vuetify/dist/vuetify.min.css">
</style>

如何让外部 CSS 不覆盖 Vuetify 组件样式?

How to make external CSS not overwrite Vuetify component style?

推荐答案

你可以试试Vue.use(Vuetify)就像那里 https://vuetifyjs.com/ru/getting-started/quick-start/我的意思是问题在于您包含样式的方式.

Can you try to Vue.use(Vuetify)Like there https://vuetifyjs.com/ru/getting-started/quick-start/I mean problem is your way to include style.

这篇关于Vuetify:外部页面 CSS 破坏了 Vuetify 的组件样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！