所说的文本是“准备就绪,通过电子邮件收到通知”的部分。我在我的Wordpress网站上为此页面使用WP维护模式插件https://wordpress.org/plugins/wp-maintenance-mode/。您可以在我的网站http://boasish.com上看到文本框。
<div class="subscribe_wrapper" style="min-height: 100px;">
<form class="subscribe_form" novalidate="novalidate">
<input type="text" placeholder="Get notified when it is ready via email" name="email" class="email_input" data-rule-required="true" data-rule-email="true" aria-required="true">
<input type="submit" value="Submit">
</form>
</div>
.wrap form.subscribe_form input[type="text"] {
text-align: center;
font-family: 'Myriad Pro';
height:42px
padding: 11px 10px 10px 0;
width: 388px;
padding-top: 16px
}
最佳答案
它属于输入元素的placeholder
属性。作为纯CSS解决方案,可以在white
获得<input>
ed时将占位符文本的颜色更改为:focus
:
.email_input:focus::-webkit-input-placeholder { /* WebKit browsers */
color: white;
}
.email_input:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: white;
}
.email_input:focus::-moz-placeholder { /* Mozilla Firefox 19+ */
color: white;
}
.email_input:focus:-ms-input-placeholder { /* Internet Explorer 10+ */
color: white;
}
<input type="text" placeholder="Get notified when it is ready via email" name="email" class="email_input" data-rule-required="true" data-rule-email="true" aria-required="true">
关于html - 单击时如何使文本框中的文本消失?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/26006497/