el-form 中el-input边框色
时间: 2023-05-30 17:06:53 浏览: 1303
el-form 中 el-input 的边框颜色可以通过以下 CSS 样式修改:
```css
.el-form-item__content .el-input__inner {
border-color: #999; /* 修改为需要的颜色 */
}
```
其中,`#999` 是颜色值,可以根据需求进行修改。
相关问题
<el-form-item <el-input 组合在一起的时候,去除掉<el-form-item的边框
可以通过设置`border`属性为`false`来去除`<el-form-item>`的边框,同时设置`border`属性为`false`也会影响到内部的`<el-input>`元素。
例如:
```html
<template>
<el-form>
<el-form-item border="false">
<el-input placeholder="请输入内容"></el-input>
</el-form-item>
</el-form>
</template>
```
vue3 <el-form-item <el-input 组合在一起的时候,去除掉<el-form-item的边框
可以通过以下两种方式去除`<el-form-item>`的边框:
1. 使用`slot-scope`自定义表单项的渲染方式,将`<el-input>`放在`<el-form-item>`的内部,然后设置`<el-form-item>`的`border:none`样式。
```
<template>
<el-form>
<el-form-item :label="label" :prop="prop" border:none>
<template v-slot="{label, error}">
<el-input :placeholder="label"></el-input>
<div class="el-form-item__error">{{error}}</div>
</template>
</el-form-item>
</el-form>
</template>
```
2. 使用 CSS 样式覆盖掉`<el-form-item>`的默认边框样式。
```
<template>
<el-form>
<el-form-item :label="label" :prop="prop" class="no-border">
<el-input :placeholder="label"></el-input>
</el-form-item>
</el-form>
</template>
<style>
.no-border .el-form-item__content {
border: none;
}
</style>
```
以上两种方式均可以去除`<el-form-item>`的边框。建议使用第一种方式,因为它更加灵活,可以自定义表单项的渲染方式。
阅读全文