element-ui中Tooltip文字提示——el-tooltip的样式修改

928 阅读1分钟

注意:以下修改都需要在全局样式修改,因为这个组件的层级,并不是在你使用他的地方,而是和你的app同一层级,所以在当前使用的地方找不到tip提示的dom节点。【在项目的根样式文件中修改(看你的main.js引入的是哪个css文件,就在哪里改),不能在页面中修改 因为toolTip的DOM节点是与app同级的】

/ .el-tooltip__popper.is-light {
//   background: #FFF !important;
//   box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.15) !important;
//   border: none !important;
// }

// // 注意[^=top]是下三角 即提示框在上方  若提示框在下方则[^=bottom] 
// //修改三角的背景颜色
// .el-tooltip__popper[x-placement^=top] .popper__arrow:after {
//   border-top-color: #ffffff !important;
// }

// // 修改三角的边框颜色
// .el-tooltip__popper.is-light[x-placement^=top] .popper__arrow {
//   // background-color: #000;
//   border-top-color: #ffffff;
// }