1. 程式人生 > 其它 >element-ui 中el-input以及el-date-picker的placeholder顏色修改

element-ui 中el-input以及el-date-picker的placeholder顏色修改

技術標籤:web相關UIVue

客戶覺得預設placeholder看不清,因此修改顏色,特此記錄一下

原效果圖
在這裡插入圖片描述
最終效果圖
在這裡插入圖片描述

<style lang="scss">
.form-items {
  .el-input__inner, .el-date-editor .el-range-input {
    color: #409eff;
    &::placeholder {
        color: #606266;
    }

    &::-webkit-input-placeholder {
        /* WebKit browsers 適配谷歌 */
        color: #606266;
    }

    &:-moz-placeholder {
        /* Mozilla Firefox 4 to 18 適配火狐 */
        color: #606266;
    }

    &::-moz-placeholder {
        /* Mozilla Firefox 19+ 適配火狐 */
        color: #606266;
    }

    &:-ms-input-placeholder {
        /* Internet Explorer 10+  適配ie*/
        color: #606266;
    }
  }
}
</style>