修改elementui 里面input的placeholder字体颜色
如何修改
代码如下:
::placeholder选中placeholder,重写样式(涉及到样式还要考虑到穿透::v-deep)
.el-input__inner::placeholder {
color: #31E5F5;
}
/* 考虑到兼容的话就是*/
/* 谷歌 */
.el-input__inner::-webkit-input-placeholder {
color: #31E5F5;
}
/* 火狐 */
.el-input__inner:-moz-placeholder {
color: #31E5F5;
}
/*ie*/
.el-input__inner:-ms-input-placeholder {
color: #31E5F5;
}
效果
案例展示
vue2.x代码文章来源:https://www.toymoban.com/news/detail-618683.html
<template>
<div class="test">
HelloWorld
<br />
<br />
<br />
<el-date-picker v-model="value" type="datetime" placeholder="选择日期时间">
</el-date-picker>
</div>
</template>
<script>
export default {
data() {
return {
value: "",
};
},
};
</script>
<style scoped>
::v-deep .el-input--prefix .el-input__inner{
color: blue;
}
::v-deep .el-input--prefix .el-input__inner::placeholder {
color: red;
}
</style>
案例效果
文章来源地址https://www.toymoban.com/news/detail-618683.html
到了这里,关于【UI】 修改element-ui input输入框placeholder提示信息、占位符的样式的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!