修改elementui 里面input的placeholder字體顏色
如何修改
代碼如下：
::placeholder選中placeholder，重寫(xiě)樣式（涉及到樣式還要考慮到穿透::v-deep）
.el-input__inner::placeholder {
color: #31E5F5;
}
/* 考慮到兼容的話(huà)就是*/
/* 谷歌 */
.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代碼文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-618683.html
<template>
<div class="test">
HelloWorld
<br />
<br />
<br />
<el-date-picker v-model="value" type="datetime" placeholder="選擇日期時(shí)間">
</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>
案例效果
文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-618683.html
到了這里，關(guān)于【UI】 修改element-ui input輸入框placeholder提示信息、占位符的樣式的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
