Родной Html Стиль Datepicker - PullRequest
Новая
       33

Родной Html Стиль Datepicker

0 голосов
/ 28 мая 2020

кто-то знает, как я могу изменить цвет текста после того, как пользователь выберет дату? Если возможно, добейтесь этого только с помощью css.

У меня есть эти цвета: 

input[type="date"]::-webkit-datetime-edit-text { color: #dbdbdb }
input[type="date"]::-webkit-datetime-edit-month-field { color: #dbdbdb; }
input[type="date"]::-webkit-datetime-edit-day-field { color: #dbdbdb; }
input[type="date"]::-webkit-datetime-edit-year-field { color: #dbdbdb; }

Итак, после того, как Пользователь выбрал дату, я хочу изменить этот цвет ввода / текста / заполнителя.

1 Ответ

0 голосов
/ 28 мая 2020


этого можно добиться, сделав поле ввода обязательным, а затем используя псевдоэлемент для поля ввода. 

.form-control:valid {
  color: green;
}
.form-control:invalid {
  color: black;
}
   <input type="date" class="form-control" placeholder="Your input" required>

Если вы не хотите делать это поле обязательным, вы можете использовать псевдоэлемент «placeholder-shown». 

input:not(:placeholder-shown) {
  color: green;
}

input:placeholder-shown {
  color: black;
}

Может охватить больше устройств, чем только при использовании технологии WebKit

...