Ant desgin vue 的样式这么难改？，错在哪？

?%ra=linkhttps://www.antdv.com/components/dropdown-cn 官网代码地址，下面这个例子

官方的属性

于是我改！样式一点没变，咋整？
这几天换ant，被样式修改弄晕了

<template>

 <a-dropdown 
 overlayClassName='dropdown'
>  
 <!-- overlayClassName={styles.dropdown} 这样写也没用-->
...略 
</a-dropdown>

</template>



<style lang="scss" scoped>
  :deep(.ant-dropdown-menu-item){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-item-only-child){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-submenu-title){
    color: red!important;
    background-color: red!important;
  }
  :deep(.ant-dropdown-menu-vertical){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-root){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-title-content){
    color: red!important;
    background-color: red!important;
  }
    
  :deep(.ant-dropdown-menu-submenu-title){
    color: red!important;
    background-color: red!important;
  }
  :deep(.ant-dropdown-menu-vertical){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-root){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-submenu){
    color: red!important;
    background-color: red!important;
  }
  
.dropdown{
//ant-dropdown-menu-item ant-dropdown-menu-item-only-child :deep(.ant-dropdown-menu-item){
  :deep(.ant-dropdown-menu-item-only-child){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-submenu-title){
    color: red!important;
    background-color: red!important;
  }
  :deep(.ant-dropdown-menu-vertical){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-root){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-title-content){
    color: red!important;
    background-color: red!important;
  }
    
  :deep(.ant-dropdown-menu-submenu-title){
    color: red!important;
    background-color: red!important;
  }
  :deep(.ant-dropdown-menu-vertical){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-root){
    background-color: red!important;
    color: red!important;
  }
  :deep(.ant-dropdown-menu-submenu){
    color: red!important;
    background-color: red!important;
  }
}
</style>

你要改什么样式

试了下，使用自定义overlayClassName，不加deep可以修改的

.dropdown里面就不用deep了，直接正常写就可以了。如果提供了api就按api正常写，实在办法才用deep去改

修改的样式不要写在scoped里边，另起一个

<style></style>

您好，我是有问必答小助手，您的问题已经有小伙伴帮您解答，感谢您对有问必答的支持与关注！
PS：问答VIP年卡 【限时加赠：IT技术图书免费领】，了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632