css - 如何更改 Vuetify 中文本字段的宽度和高度？

Question

我想更改 <v-text-field> 的宽度和高度标签。

我已经尝试用 .css 来做，但它不会改变实际文本字段的参数，而只会改变一些不可见的参数，这会导致我的文本框出现大的空白页面。

这是我已经尝试过的。

<template>
  <v-text-field class="first"></v-text-field>
</template>

<style>
  .first {
    width: 150px !important;
    height: 350px !important
  }
</style>

Answer 1

您不需要添加 CSS 规则来更改 v-text-field 高度，您可以简单地使用 height 属性，例如:

  <v-text-field height="350"></v-text-field>

但是你的组件应该放在 template 而不是 script 标签中:

 <template>
  <v-text-field height="350"></v-text-field>
 </template>