elmentui 单选变成按钮形状
时间: 2023-09-11 15:09:48 浏览: 68
按钮式单选
你可以使用 Element UI 的 `el-button` 组件来实现单选按钮的样式。具体来说,你可以在 `el-radio` 组件外部包裹一个 `el-button` 组件,然后将 `el-radio` 组件的样式隐藏掉。示例代码如下:
```html
<el-button-group>
<el-radio label="选项一">
<el-button>选项一</el-button>
</el-radio>
<el-radio label="选项二">
<el-button>选项二</el-button>
</el-radio>
<el-radio label="选项三">
<el-button>选项三</el-button>
</el-radio>
</el-button-group>
<style>
.el-radio {
display: none;
}
</style>
```
在这个示例中,我们将三个 `el-radio` 组件包裹在一个 `el-button-group` 组件中。每个 `el-radio` 组件内部都包含一个 `el-button` 组件,显示单选按钮的文本。然后,我们使用 CSS 将 `el-radio` 组件的样式隐藏掉,只显示 `el-button` 组件的样式。这样就可以实现单选按钮的样式了。
阅读全文