elementui样式修改input篇

最新推荐文章于 2024-08-08 10:30:04 发布

lhttq

最新推荐文章于 2024-08-08 10:30:04 发布

阅读量4.4k

点赞数 2

分类专栏： elementUI 前端

本文链接：https://blog.csdn.net/lhttq/article/details/108365315

版权

前端同时被 2 个专栏收录

10 篇文章 1 订阅

订阅专栏

elementUI

2 篇文章 0 订阅

订阅专栏

elementui修改input样式

input样式修改主要用到 .el-input__inner(类名)直接在里面改就好了，输入域的话用 .el-textarea__inner如：

.el-input__inner {
  background-color: #000;
  border: 1px solid #eee;
  height: 32px;
  font-size: 12px;
  color: #fff;
}
.el-textarea__inner {
  background-color: #000;
  border: 1px solid #eee;
  height: 88px;
  color: #fff;
}

这些都不是难点，还是修改输入提示文字的样式，查了好久，修改输入提示文字的样式如下

.el-input__inner::-webkit-input-placeholder { // 谷歌内核
  color: #fff;
  font-size: 12px;
}
.el-input__inner:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #fff;
  font-size: 12px;
}

.el-textarea__inner::-webkit-input-placeholder,
.el-input__inner::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color:#fff;
  font-size: 12px;
}

.el-textarea__inner::-webkit-input-placeholder,
.el-input__inner:-ms-input-placeholder {
  /* Internet Explorer 10+ */
  color: #fff;
  font-size: 12px;
}