zoukankan      html  css  js  c++  java
  • H5表单中placeholder属性的字体颜色问题

    最近做项目的时候遇到的一些小样式问题,有关表单。并且在接下来几天的面试人中五个人都没有回答上来,改变placeholder属性的默认字体颜色,感觉有必要总结一下。

    如何改变默认字体的颜色?

    @blue: #026b9c;

    input {
    100%;
    height: 74/30rem;
    line-height: 74/30rem;
    color: @blue;
    border-radius: 16/30rem;
    border: 1px solid @blue_light;
    font-size: 28/30rem;
    padding-left: 15/30rem;
    }
    input::-webkit-input-placeholder {
    /* WebKit browsers */
    color: @blue;
    }
    input:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: @blue;
    }
    input::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: @blue;
    }
    input:-ms-input-placeholder {
    /* Internet Explorer 10+ */
    color: @blue;
    }

    主要是通过伪元素+私有前缀这种方式实现,具体实现机制暂时不甚了解,存在兼容性问题。。。当我问这个问题的时候,希望有更好的办法?不过好多人把input的color,甚至于background-color都搞混淆了,好尴尬。

  • 相关阅读:
    canvas背景粒子动态变化动画
    点击屏幕弹出心形效果
    前端图片的性能优化
    vue的computed和method的区别
    es6的...
    命名路由和命名视图
    编程式路由
    [思维]蚂蚁感冒
    [模板]前缀树 / 字典树及应用
    [模板]三分搜索
  • 原文地址:https://www.cnblogs.com/bug-master/p/6169804.html
Copyright © 2011-2022 走看看