CSS стили для placeholder

CSS стили для атрибута placeholder="" можно задать через псевдокласс ::placeholder и вендорными префиксами для разных браузеров:

  • ::-webkit-input-placeholder
  • ::-moz-placeholder
  • :-moz-placeholder
  • :-ms-input-placeholder
input[type=text]::-webkit-input-placeholder {
	font-size: 12px;
	color: rgb(245, 245, 245);
}
input[type=text]::-moz-placeholder {
	font-size: 12px;
	color: rgb(245, 245, 245);
}
input[type=text]:-moz-placeholder {
	font-size: 12px;
	color: rgb(245, 245, 245);
}
input[type=text]:-ms-input-placeholder {
	font-size: 12px;
	color: rgb(245, 245, 245);
}
input[type=text]::placeholder {
	font-size: 12px;
	color: rgb(245, 245, 245);
}
CSS

Placeholder-shown

Также есть псевдокласс :placeholder-shown который позволяет выделить инпут до того как в него будет введен текст.

input[type=text]:placeholder-shown {
	border: 1px solid red;
}
CSS
11.10.2016 , обновлено 13.01.2020
Предыдущая запись Как отключить тег br
Следующая запись Clearfix – отмена действия float

Комментарии

, чтобы добавить комментарий.

Другие публикации

В jQuery, селекторы в основном позаимствованы из CSS 1-3, также добавлены свои, что дало хороший набор инструментов для...
07.08.2019 769
К сожалению разработчики прекратили поддержку и разработку проекта, но PHPExcel все равно остается популярной...
12.06.2019 7221
Сборник приемов JQuery для работы с чекбоксом.
14.12.2016 60002
Функции Javascript для вывода и отладки информации в консоли браузера.
27.03.2019 771
Сборник примеров установки меток на карту по координатам и адресу, изменение их вида и вывод балунов.
24.07.2018 7878
Буквица, или инициал – первая буква главы или раздела, выделяется цветом и шрифтом. В CSS есть несколько способов...
28.10.2019 273