修改el-tooltip的提示框宽度

在当前组件新建一个style ,不要写scoped。vue 设置 el-tooltip 最大宽度。

【代码】el-tooltip。

el-tooltip的提示框宽度修改。

注：style 里不要加 scoped。

在使用el-tooltip时不会默认换行，官网也没有相对应的字段来控制，网上大部分都是去掉scope,但是这样做很容易造成代码混乱，不推荐使用，经过我测试，使用以下方法可轻松解决自定义问题。

命名一定要保证不要和全局别的类名重复。,这里的样式会应用到全局,所以。

【代码】修改el-tooltip的宽度。

一些特殊的场景需要根据一定的宽度来控制文字内容是否溢出显示省略号显示并且在鼠标悬浮时有提示，内容未超过时正常显示内容。

使用el-tooltip配合（3）（4）两个属性在el-tree中可以实现当某一层级字数过多，对名称有一个缩写，并且悬浮显示全部名称的效果，这里还配合使用了动态样式使用getWidth()方法。（5）Popover 和Tooltip 是有相似的属性的，你可以尝试把Popover的属性用在Tooltip上，说不定可以成功。这里我想说的是，当我们的表格中的某一列单元格的内容超级多的时候，肯定是需要设置show-overflow-tooltip实现鼠标悬浮显示全部信息的。这个组件使用起来也挺简单的，

也有可能不需要后面的 .is-dark，看情况而定，总之不是.el-tooltip。

el-tooltip过宽，el-tooltip样式修改

【Element UI】el-tooltip组件（提示消息）悬浮框宽度和内容换行设置

<el-tooltip class="item" effect="dark" :content="11111111111111111111111111111111111111111111111111111" placement="top-start" > <div>111...

修改el-tooltip的样式，代码如下： .el-tooltip__popper { max-width: 60%!important; //宽度可根据自己需要进行设置 } 注意：需写在公共样式表中，若写在同页面的<style scoped> </style>中不会生效。 参考：(15条消息) element ui table tooltip设置宽度_伍六七-CSDN博客_el-tooltip设置宽度 ...