Vue.js 无法更改v-dialog样式

我想更改.v-dialog类的边距和非全屏时的最大高度

控制台中的代码：

.v-dialog {
  border-radius: 4px;
  margin: 24px; <-------- want to change this
  overflow-y: auto;
  pointer-events: auto;
  -webkit-transition: .3s cubic-bezier(.25,.8,.25,1);
  transition: .3s cubic-bezier(.25,.8,.25,1);
  width: 100%;
  z-index: inherit;
  -webkit-box-shadow: 0 11px 15px -7px rgba(0,0,0,.2), 0 24px 38px 3px rgba(0,0,0,.14), 0 9px 46px 8px rgba(0,0,0,.12);
  box-shadow: 0 11px 15px -7px rgba(0,0,0,.2), 0 24px 38px 3px rgba(0,0,0,.14), 0 9px 46px 8px rgba(0,
}

.v-dialog{
边界半径：4px；
margin:24px；如果您还没有这样做，那么最好使用文档作为参考


如果要将类附加到
v对话框

将自定义类应用于分离的元素。这非常有用，因为
内容移动到v-app组件的开头（除非
提供了attach prop）并且不可由传递的类作为目标
直接在组件上

在此类中，您可以覆盖
边距
和
最大高度
：

.custom-dialog.v-dialog{
    margin: 10px;
}

.custom-dialog.v-dialog:not(.v-dialog--fullscreen) {
  max-height: 50%;
}

如果您还没有这样做，那么最好使用文档作为参考


如果要将类附加到
v对话框

将自定义类应用于分离的元素。这非常有用，因为
内容移动到v-app组件的开头（除非
提供了attach prop）并且不可由传递的类作为目标
直接在组件上

在此类中，您可以覆盖
边距
和
最大高度
：

.custom-dialog.v-dialog{
    margin: 10px;
}

.custom-dialog.v-dialog:not(.v-dialog--fullscreen) {
  max-height: 50%;
}

我添加了内容类，如：和您建议的css，但样式不起作用？@MaikenMadsen您能看到它是否应用于开发人员控制台吗？它已应用，但样式没有，这太复杂了？您是否正在运行
npm run service
或
npm run dev
，因此它实际上编译了样式？或者您是如何操作的在逻辑上编写样式？这是因为样式被放置在作用域样式中，现在它工作了，但answear对于实际问题是正确的：-）我添加了内容类，如：和您建议的css，但样式不工作？@MaikenMadsen您能看到它是否在开发人员控制台中应用吗？它已应用，但样式是not，这太复杂了？您是否正在运行
npm运行服务
或
npm运行开发
，因此它实际上编译了样式？或者您实际上是如何编写样式的？这是因为样式被放置在范围样式中，现在它正在工作，但answear对于实际问题是正确的：-）