vue的边距怎么设置_javascript-如何在Vuetify中删除填充或边距？

The doc告诉我可以使用帮助程序类来更改填充/边距.我想从输入字段中删除填充,所以我需要的类是pa-0({属性} {方向}-{大小})：

不起作用任何想法？

编辑：我意识到与本地设置相比,我在JSFiddle中获得了完全不同的标记,这使我感到困惑：

Vuetify在本地生成的标记(这里我想删除< input>元素内部的垂直填充和< div class =“ v-input__slot”>元素上的水平填充)：

由Vuetify在JSFiddle上使用完全相同的Vuetify代码行生成的标记(< v-text-field v-model =“ mon” pa-0 outline< / v-text-field>)：

整个文档中缺少示例确实没有帮助.

解决方法:

class =“ ma-0”删除边距

class =“ pa-0”删除填充

class =“ ma-0 pa-0”会同时删除

请注意,这些也是道具,但仅适用于某些(网格)组件,因此例如：

< v-text-field class =“ pa-0”>< / v-text-field>将工作,

和< v-text-field pa-0 -gt;< / v-text-field>不管用.

在顶级元素上添加了类,因此,如果在某些组件中无法删除这些类的子元素间距,则可能需要使用CSS定位相关元素.

为了避免使用！important,请在组件上添加自定义类并检查要编辑的元素,然后检查用于定位的元素-例如.v-input__slot(我们只需要突出显示的目标)：

然后像这样替换它(custom-text-field是应用于组件的任意自定义类)

.custom-text-field.v-text-field.v-text-field--enclosed .v-input__slot {

padding: 0;

}

标签：html,vuetify-js,javascript

来源： https://codeday.me/bug/20191011/1888934.html