// 选择器外部样式
.ant-select-selection {
background-color: #002761 !important;
color: rgba(255, 255, 255) !important;
border: 1px solid #00a7ef !important;
border-radius: 0 !important;
}
// 选择器箭头样式
.ant-select-selection .anticon {
color: #00cbef !important;
}
// 选择器清理图标样式
.ant-select-selection__clear {
background-color: #00122e52 !important;
}
// 选择器下拉菜单字体颜色
.ant-select-dropdown-menu,
.ant-select-dropdown-menu-root,
.ant-select-dropdown-menu-vertical li {
color: white !important;
}
// 选择器下拉菜单背景颜色
.ant-select-dropdown {
color: white !important;
border: 1px solid #00a7efab !important;
background-color: #002761 !important;
box-shadow: 1px 1px 12px -1px #0095ff7a inset !important;
}
// 选择器下拉菜单选中的数据,与鼠标移入样式
.ant-select-dropdown-menu-item-selected,
.ant-select-dropdown-menu-item-active {
background-color: #0afce86c !important;
color: white !important;
}
结果图:
需要注意的是:要另起一个css文件,在需要的vue页面导入这份css文件就生效了。如果直接在vue页面写这些代码,有部分代码是不会生效的。