el-input去掉边框
时间: 2023-07-05 18:22:19 浏览: 631
你可以通过设置 el-input 的 border 属性为 none 来去掉边框,如下所示:
```html
<el-input placeholder="请输入内容" :border="none"></el-input>
```
或者你可以通过设置 el-input 的自定义样式来去掉边框,如下所示:
```html
<el-input placeholder="请输入内容" style="border:none;"></el-input>
```
相关问题
vue el-table 里面el-input去除边框
在Vue的Element UI组件中,如果你想在`<el-table>`里嵌套的`<el-input>`去除边框,你可以通过CSS样式来实现。你需要找到这个输入框元素并设置其`border`属性为`none`。例如:
```html
<template>
<el-table :data="tableData">
<el-table-column prop="name" label="姓名"></el-table-column>
<el-table-column prop="age" label="年龄">
<template slot-scope="scope">
<el-input v-model="scope.row.age" class="no-border-input" @input="handleInput(scope.$index, scope.row)"></el-input>
</template>
</el-table-column>
</el-table>
</template>
<style scoped>
.no-border-input {
border: none; /* 这里设置了无边框 */
box-sizing: border-box;
}
</style>
```
在这个例子中,`.no-border-input`类用于选择`el-input`并移除边框。你还可以添加其他自定义样式,比如背景颜色、内边距等。
element el-input 去掉边框
可以通过设置 CSS 样式来去掉 `el-input` 的边框,具体方法如下:
```css
.el-input__inner {
border: none;
}
```
这会将 `el-input` 内部的输入框的边框去掉。如果还需要去掉外部的边框,可以再添加如下样式:
```css
.el-input {
border: none;
box-shadow: none;
}
```
这会将 `el-input` 的外部边框和阴影也去掉。
相关推荐
![txt](https://img-home.csdnimg.cn/images/20210720083642.png)
![-](https://img-home.csdnimg.cn/images/20210720083327.png)
![-](https://img-home.csdnimg.cn/images/20210720083327.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)