How to change the select color in antdv

How to change the select color in antdv

Go directly to the topic
1. 这是Vue template中的其中模板

    <div class="test">
        <a-select default-value="lucy" style="width: 120px" @change="handleChange">
        <a-select-option value="jack">
            Jack
        </a-select-option>
        <a-select-option value="lucy">
            Lucy
        </a-select-option>
        <a-select-option value="disabled" disabled>
            Disabled
        </a-select-option>
        <a-select-option value="Yiminghe">
            yiminghe
        </a-select-option>
        </a-select>
    </div>

2. 如何更改颜色???

  :deep(.test){
    
    
      .ant-select .ant-select-selector{
    
    
                border-color: none !important;
                border: 1px solid #d7d7d7 !important;
                box-shadow: none;
            &:hover {
    
    
                border: 1px solid red !important;
                box-shadow: none;
            }
            &:focus {
    
    
                border: 1px solid red !important;
            }
            &:focus-within {
    
    
                border: 1px solid red !important;
                box-shadow: 0 0 0 2px rgba(230, 0, 44, 0.2)!important;
            }
         }
     }

可以了! 我接触的Vue 时间也不到1个月 但是呢我觉得 这样式部分

重在于这个 :deep( )

恩 好了 就这么多说了 下次再见!

Guess you like

Origin blog.csdn.net/weixin_43814775/article/details/113099999