Question

我已经开始了一个新网站（http://energyamplified.co.za/home.php）并且在我的生活中我无法理解这一点，我试图覆盖浏览器（webkit和moz当前正在测试）占位符文本的默认值。我已经尝试设置文本的类型，使用！important（我从来不想做）为了覆盖浏览器的DarkGray默认值，使用外部网站来测试CSS，它运行正常 - 我无法弄清楚这一点。

HTML代码：

                <header>
                    <h1>Contact Us</h1>
                </header>
                <div id="contact_email"><a href="mailto:info@energyamplified.co.za">info@energyamplified.co.za</a></div>
                 <div id="contact_wrapper">
                 <form method="post" name="contactform" id="contactform">   

                <fieldset>
                <div id="form_left">
                <p><label for="name" accesskey="U"><span class="required"></span></label>
                <input name="name" type="text" id="name" size="50" value="" placeholder="Name"/></p>
                <p><label for="email" accesskey="E"><span class="required"></span></label>
                <input name="email" type="text" id="email" size="50" value=""  placeholder="Email"/></p>
                <p><label for="phone" accesskey="P"><span class="optional"></span></label>
                <input name="phone" type="text" id="phone" size="50" value=""  placeholder="Phone (optional)"/></p>
                </div>

                <div id="form_right">
                <p><label for="comments" accesskey="C"><span class="required"></span></label>
                <textarea name="comments"  rows="8" cols="40"  id="comments" style="width: 450px;" placeholder="Type message here..."></textarea></p> 

                <div id="bot"><p><span class="required">*</span> Are you a bot?</p></div> 
                <div id="spam">
                <div id="spam_2">
                <label for="verify" accesskey="V"><img src="image.php" alt="" /></label>
                <input name="verify" type="text" id="verify" size="5"/></div>
                <input type="submit" class="submit" id="submit" value="Submit" />
                </div>
                </fieldset>
                </form>
                </div>
                </div>

CSS：

::-webkit-input-placeholder { /* Chrome */
color: #000;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color:    #000;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color:    #000;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
color:    #000;
}

[type="text"] {
    -moz-appearance:    textfield;
    -webkit-appearance: textfield;
    appearance: textfield;
}

Answer 1

你的样式表有一个错误：

input#name, input#email,input#phone { border: 0; background-color: #F0EDED; {

将其更改为

input#name, input#email,input#phone { border: 0; background-color: #F0EDED; }

关闭大括号中的错字是问题！

默认浏览器css没有被覆盖

1 个答案: