el-date-picker样式修改

el-date-picker样式修改

模板

<el-col :span="12"><div class="detail-row flex-row"><span class="detail-label"><span style="color: red;margin-right: 4px;">*</span>事件时间</span><div class="detail-value" style="display: flex;"><el-date-pickerv-model="warnReport.eventTime"format="yyyy-MM-dd HH:mm:ss"value-format="yyyy-MM-dd HH:mm:ss"type="datetime"placeholder="  选择事件时间"/></div></div></el-col>

修改前样式

  .detail-value {color: rgba(99, 202, 255, 1);font-weight: 400;flex: 1;font-size: 0.64rem;line-height: 1rem;}

修改前效果:

image

 样式修改

  .detail-value {color: rgba(99, 202, 255, 1);font-weight: 400;flex: 1;font-size: 0.64rem;line-height: 1rem;
    ::v-deep .el-input--small .el-input__icon {width: 1.8rem !important;height: 1.8rem !important;line-height: 1.8rem !important;display: flex;align-items: center;justify-content: center;//background-color: red !important;
    }}

修改后效果:

image