首页 文章

将输入占位符颜色更改为更暗

提问于
浏览
20

按照这篇文章(Style text input placeholder),我可以将文本输入占位符的颜色更改为红色 . 但它总是浅红色,而不是红色 .

有没有办法让它完全变成红色?

update

Chrome上的颜色是红色(这是正确的),Firefox上的颜色不是红色,它是浅红色或模糊的,我猜对了 .

http://i279.photobucket.com/albums/kk132/svincoll4/2013-03-19_181239_zps84166305.png


编辑(来自OP答案):

请检查此示例(http://jsfiddle.net/LQkQG/),Chrome上的颜色为红色,但Firefox上的颜色为 light-red . 我希望Firefox上的颜色与Chrome相同 .

4 回答

  • 50

    我发现你需要覆盖不透明度 .

    ::-webkit-input-placeholder { /* WebKit browsers */
        color:    red;
         opacity: 1 !important;
    }
    
  • -3

    是的,通过HEX(十六进制)设置其值可以更好地控制要使用的颜色 . 鲜红色(颜色为红色)的颜色为 #FF0000

    然而,Firefox需要被告知叛逆者使用什么不透明度 .

    如需参考,请查看this chart

    ::-webkit-input-placeholder {
        color: #FF0000;
        opacity: 1 !important; /* for older chrome versions. may no longer apply. */
    }
    
    :-moz-placeholder { /* Firefox 18- */
        color: #FF0000;
        opacity: 1 !important;
    }
    
    ::-moz-placeholder {  /* Firefox 19+ */
        color: #FF0000;
        opacity: 1 !important;
    }
    
    :-ms-input-placeholder {  
       color: #FF0000;
    }
    
  • -4

    输入颜色的十六进制值 .

    也许使用像http://www.colorpicker.com/这样的工具?

  • 19

    访问:http://www.w3schools.com/html/html_colors.asp

    <html>
    <head>
    <style type="text/css">
    
        input, textarea { color: #000; }
        .placeholder { color: #aaa; }
    </style>
    </head>
    <body>
    <form action="" method="post">
    
                <input type="text" name="user" placeholder="enter a text" />
                <input type="submit" value="submit" onclick="test()" />
    </form>
    

    在颜色代码的位置,您可以编写您想要的颜色

相关问题