• elementui中自定义Select选择器样式自定义


    <el-select class="my-el-select" v-model="tenantCont" placeholder="请输入机构标识">
         <el-option-group
             v-for="group in options"
             :key="group.label"
             :label="group.label">
                <el-option
                    v-for="item in group.options"
                    :key="item.value"
                    :label="item.label"
                     :value="item.value">
                 </el-option>
           </el-option-group>
     </el-select>
    
    options: [{
        label: '之前登录的机构标识',
              options: [
                   {
                       value: '000001',
                       label: '蓝翔1山东蓝翔1(机构标识001)'
                   }, {
                       value: '000002',
                       label: '蓝翔1山东蓝1山东蓝翔1(机构标识001)'
                   },
                   {   
                     value: '000003',
                       label: '蓝翔1山东蓝翔1(机构标识001)',
                    }
                 ]
    }]
    
    // 之前登录的机构标识 居中
    .el-scrollbar .el-select-group__wrap /deep/ .el-select-group__title{
        text-align: center !important;
    }
    // 内容居中
    .el-scrollbar .el-select-group__wrap /deep/ .el-select-dropdown__item{
        text-align: center !important;
    }
    // 去除点击时候的淡蓝色边框
    .my-el-select /deep/ .el-input .el-input__inner {
       border-color: #DCDFE6  !important;
    }
    

    作者:明月人倚楼
    出处:https://www.cnblogs.com/IwishIcould/

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    如果觉得这篇文章对你有小小的帮助的话,记得在右下角点个“推荐”哦,或者关注博主,在此感谢!

    万水千山总是情,打赏5毛买辣条行不行,所以如果你心情还比较高兴,也是可以扫码打赏博主(っ•̀ω•́)っ✎⁾⁾!

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    支付宝
    微信
    本文版权归作者所有,欢迎转载,未经作者同意须保留此段声明,在文章页面明显位置给出原文连接
    如果文中有什么错误,欢迎指出。以免更多的人被误导。
  • 相关阅读:
    datagridview中读取数据判断+考勤每月上班天数判断
    dateTimePicker日期比较+时间段内查询+员工查询薪资步骤+datagridview
    c#word 存取
    位图去空白
    过桥问题
    Dominos 2(DFS)(容器)
    poj 3421(三分)
    poj 3186(DP)
    安装Ubuntu
    poj 3273(二分)
  • 原文地址:https://www.cnblogs.com/IwishIcould/p/14614413.html
Copyright © 2020-2023  润新知