Chrome支持占位符属性的input[type=text]元素(别人可能做太多).
但以下CSS内容对占位符的值没有任何作用:
input[placeholder], [placeholder], *[placeholder] {
color: red !important;
}<input type="text" placeholder="Value">Value仍然会留下grey而不是red.
有没有办法改变占位符文本的颜色？
如果输入标签中有需要，标签效果将起作用。但如果我删除所需的属性，效果将不起作用单击查看工作小提琴 是否有任何解决方案。
html
<div class="group ">
<input type="text" required="" class="module-input" />
<label >Name</label>
</div>
片段：
<div class="group ">
<input type="text" required="" class="module-input" />
<label >Name</label>
</div>
.module-input {
font-size: 14px;
padding-top: 12px;
display: block;
width: 97%;
border: none;
border-bottom: 1px solid #94a3a9;
background-color: transparent;
color: #5a686d;
margin-bottom: 2%;
}
input:focus {
outline: none;
}
.group {
position: relative;
margin-bottom: 25px;
}
/* LABEL */
label {
color: #94a3a9;
font-size: 14px;
font-weight: normal;
position: absolute;
pointer-events: none;
left: 0.5%;
top: …我正在尝试编写一些代码，如果输入为空，则输入颜色变为红色。用户键入输入后，红色将被删除。
HTML
<html>
<head>
<!-- add main style -->
<link rel="stylesheet" href="../css/style.css">
<!-- add JQuery -->
<script
src="https://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"></script>
</head>
<body>
<div class="financeContainer">
<div class="searchBox">
<input id="financeSearch" type="text" class="financeInput" placeholder="Enter The Code">
<button id="financeBtn" class="financeSearchBt"><i class="fas fa-search financeSearchIcon"></i></button>
</div>
</div>
<script>
</script>
</body>
</html>
的CSS
.redColor{
color: red;
}
jQuery的
$(document).ready(function () {
$("#financeSearch").keydown(function () {
if ($("#financeSearch").val().length>0){
$("#financeSearch").removeClass("redColor")
}
});
$(document).bind('keypress', function(e) {
if(e.keyCode==13){
$('#financeBtn').trigger('click');
}
});
$("#financeBtn").click(function () {
var financeKey = $("#financeSearch").val();
if (financeKey == ""){ …