Поиск

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, обновлено 17.10.2019 1011

Темы

#CSS #Формы
Предыдущая запись Как отключить тег br
Следующая запись Clearfix – отмена действия float

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

К сожалению разработчики прекратили поддержку и разработку проекта, но PHPExcel все равно остается популярной...
12.06.2019 3821
В статье представлены все самые встречающеюся мета-теги с примерами и пояснениями их использования.
17.01.2018 2959
Градиент в цвет шрифта можно добавить с помощью CSS свойства background-clip: text, которое окрашивает текст в цвет или...
13.09.2018 2285
Функции Javascript для вывода и отладки информации в консоли браузера.
27.03.2019 533
Сборник примеров установки меток на карту по координатам и адресу, изменение их вида и вывод балунов.
24.07.2018 6873
Способ выравнять текст по вертикали в блоках фиксированной высотой. Текст обворачивается в тег с классом .child, а за...
07.12.2016 1107