elementui的el-popover修改样式不生效的解决

作者:爱喝冬瓜汤的外星人 时间:2024-05-09 15:22:24 

在使用element-ui的时候,有一个常用的组件,那就是el-popover,但是element-ui官方文档中样式跟用法都比较局限,在使用时都需要改动样式

项目中使用了el-popover,但是想修改一下样式,一直不成功,先来看一下官方文档怎么说的

elementui的el-popover修改样式不生效的解决

添加一个类名,string类型,ok,添加一个


<el-popover
   placement="right"
   width="400"
   trigger="hover"
   popper-class="my-popover"
   >

去设置样式


<style lang="scss" scoped>
.my-popover{
padding:20px;
}
</style>

elementui的el-popover修改样式不生效的解决

结果就是没有设置成功!
是不是因为scoped,不加scoped再试一下!


<style>
my-popover{
   padding:10px 30px;
}
</style>

elementui的el-popover修改样式不生效的解决

还是没有效果!!!
经过疯狂试验以及网上搜索!
最终写法是这样,.el-popover.my-popover 这种格式,前缀是.el-popover ,不然不生效。且不能加上scoped


<style>
.el-popover.my-popover{
   padding:10px 30px;
}
</style>

elementui的el-popover修改样式不生效的解决

修改成功!

来源:https://juejin.cn/post/6979034958660632613

标签:el-popover,样式
0
投稿

猜你喜欢

  • PyCharm搭建一劳永逸的开发环境

    2022-12-23 20:24:23
  • Python编程实现简单的微博自动点赞

    2021-05-14 06:43:12
  • 基于Django实现日志记录报错信息

    2021-06-22 06:24:23
  • Matlab常用的输出命令disp与fprintf解读

    2022-03-18 17:13:58
  • Python利用psutil实现获取硬件,网络和进程信息

    2023-08-12 18:37:44
  • [Oracle] Data Guard CPU/PSU补丁安装详细教程

    2024-01-26 05:48:21
  • php 读取文件头判断文件类型的实现代码

    2023-11-15 09:50:06
  • pip已经安装好第三方库但pycharm中import时还是标红的解决方案

    2022-05-25 00:50:16
  • BootStrap的alert提示框的关闭后再显示怎么解决

    2024-04-28 09:50:24
  • python使用Flask框架获取用户IP地址的方法

    2023-08-09 03:15:23
  • MySQL性能优化的一些技巧帮助你的数据库

    2024-01-20 12:44:22
  • PHP单例模式Singleton Pattern的原理与实现介绍

    2023-05-26 13:33:28
  • 使用Gomock进行单元测试的方法示例

    2024-04-25 15:13:23
  • php实现将数组或对象写入到文件的方法小结【三种方法】

    2023-11-19 05:08:04
  • python生成指定长度的随机数密码

    2021-01-24 23:53:17
  • Django如何实现内容缓存示例详解

    2022-02-23 15:33:01
  • Oracle SQL性能优化系列学习一

    2010-07-26 13:14:00
  • pytorch下的unsqueeze和squeeze的用法说明

    2023-07-16 14:01:41
  • Python实现统计代码行的方法分析

    2023-10-15 13:08:44
  • 利用numpy+matplotlib绘图的基本操作教程

    2021-01-26 11:14:31
  • asp之家 网络编程 m.aspxhome.com