element-ui 修改el-tooltip样式
通过截图可以发现,tooletip所在的div,并不在当前页面的div内,而是在另外一个独立的div内所以在当前页面内直接通过修改这个类el-tooltip__popper的样式,样式未生效解决办法需要注意的就是,该代码片段,需要写在根文件的style里,如果写在当前文件里也并非不可,但是需要将scope取消掉,原因在上方已阐述过一次。该组件的层级不在于你使用的地方,它与跟文件属于统一层级.my-
·
通过截图可以发现,tooletip所在的div,并不在当前页面的div内,而是在另外一个独立的div内
所以在当前页面内直接通过修改这个类el-tooltip__popper的样式,样式未生效
解决办法
需要注意的就是,该代码片段,需要写在根文件的style
里,如果写在当前文件里也并非不可,但是需要将scope
取消掉,原因在上方已阐述过一次。该组件的层级不在于你使用的地方,它与跟文件属于统一层级
.my-tooltip {
padding: 2px 3px;
border-radius: 3px;
font-size: 10px;
line-height: 1.6;
.is-light{
border: 1px solid #ebeef5;
}
}
另外,因为是鼠标悬浮,才能显示出样式,比较不容易控制,可以参见element-ui 的Popover 弹出框样式
更多推荐
已为社区贡献3条内容
所有评论(0)