element-ui中el-input需要改变placeholder的字体颜色

Posted 5201314m

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了element-ui中el-input需要改变placeholder的字体颜色相关的知识,希望对你有一定的参考价值。

如下所示,需要改变输入框中默认文字的字体颜色,

技术图片

input::-webkit-input-placeholder {
    color: #c0c4cc;
  }
  input::-moz-input-placeholder {
    color: #c0c4cc;
  }
  input::-ms-input-placeholder {
    color: #c0c4cc;
  }

在vue文件中加上上面代码就可以实现改变输入框中默认文字颜色了,

如果不生效,可以试一下在前面加上/deep/应该就可以了。

 

html代码有如下两种,即使用input/el-input,都可以使用上面的代码。

<el-form-item prop="password">
      <input @keyup.enter="login" type="password" :value="pwd" @input="setPwd" placeholder="请输入密码">
</el-form-item>


<el-form-item label="" prop="userName">
     <el-input v-model="form.userName" placeholder="用户名"></el-input>
</el-form-item>

 

以上是关于element-ui中el-input需要改变placeholder的字体颜色的主要内容,如果未能解决你的问题,请参考以下文章

element-ui 组件改变样式

vue使用element-ui的el-input监听不了键盘事件解决

vue使用element-ui的el-input监听不了键盘事件解决

vue使用element-ui的el-input监听不了键盘事件解决

element-ui input 组件 回车事件

[element-ui] el-input根据内容自适应宽度