时间戳

首页 > 解决方案 > 如何在 Vuetify 中更改文本字段的宽度和高度？

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

问题描述

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

我已经尝试使用.css进行此操作，但它不会更改实际文本字段的参数，而只会更改某些不可见的参数，从而导致我的页面上出现大空白。

这是我已经尝试过的。

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

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

标签： cssvue.jsvuejs2vue-componentvuetify.js

解决方案

您不需要添加 CSS 规则来更改v-text-field高度，您可以简单地使用以下height道具：

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

但您的组件应放置在templatenot inscript标记内：

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

推荐阅读