elementui 按钮内部文本自动换行
时间: 2024-07-09 12:00:36 浏览: 259
CSS超出文本指定宽度用省略号代替和文本不换行
Element UI 的按钮默认情况下并不支持内部文本的自动换行,如果需要实现这样的功能,你需要自定义样式或者使用一些 CSS技巧。你可以尝试使用 `white-space: normal;` 或者 `word-wrap: break-word;` 来让文本内容能够换行。
```html
<el-button :style="{ whiteSpace: 'normal', wordWrap: 'break-word' }">这是一个很长很长的文字,可能会自动换行</el-button>
```
或者如果你想要更细粒度的控制,可以在按钮上包裹一个 `div` 或者其他的可设置 `line-height` 和 `text-overflow` 的元素,并且给这个容器设置样式。
```html
<el-button>
<div style="display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 20px;">这是一个很长很长的文字,可能会自动换行...</div>
</el-button>
```
阅读全文