修改el-input里placehoder字体颜色

最新推荐文章于 2024-07-27 14:53:45 发布

hibiscusxin

最新推荐文章于 2024-07-27 14:53:45 发布

阅读量3k

点赞数 3

分类专栏： element 文章标签： css vue.js

本文链接：https://blog.csdn.net/qq_41838435/article/details/110533011

版权

element 专栏收录该内容

22 篇文章 3 订阅

订阅专栏

vue-element

修改input里placehoder字体颜色，解决firefox不生效问题

 <div class="search">
     <el-input
               v-model="formInline.searchName"
               class="pool-search"
               style="width:666px;"
               placeholder="请输入名称进行搜索"
               :trigger-on-focus="false"
               @keyup.enter.native="handleSelect"
               >
         <span slot="suffix" class="iconfont" @click="handleIconClick">&#xe6fc;</span>
     </el-input>
</div>

.el-input__inner {
      &::placeholder {
        color: #696969;
      }
      &::-webkit-input-placeholder {
        /* Chrome/Opera/Safari */
        color: #696969;
      }
      &:-moz-placeholder {
        /* Mozilla Firefox 4 to 18 适配火狐 */
        color: #696969;
        /* 设置opacity  解决firefox不生效问题 */
        opacity: 1;
      }
      &::-moz-placeholder {
        /* Mozilla Firefox 19+ 适配火狐 */
        color: #696969;
        opacity: 1;
      }
      &:-ms-input-placeholder {
        /* Internet Explorer 10+  适配ie*/
        color: #696969;
      }
    }