如何让 element-ui 中的 el-input 和 el-button 在同一行
时间: 2024-05-12 16:17:24 浏览: 322
vue2.0结合Element-ui实战案例
您可以使用 flex 布局将 el-input 和 el-button 放在同一行。具体来说,您可以将它们包装在一个容器里,并将容器的 display 属性设置为 flex,并设置容器的 justify-content 属性为 space-between 或 space-around,这将使两个元素之间有一些间距。另外,您可以使用 flex-grow 和 flex-shrink 属性调整元素的大小。
示例代码:
```html
<template>
<div class="container">
<el-input placeholder="请输入内容"></el-input>
<el-button>搜索</el-button>
</div>
</template>
<style>
.container {
display: flex;
justify-content: space-between;
}
</style>
```
阅读全文