Оформление placeholder

Вопросы
Не подскажете, как изменить цвет шрифта placeholder? В form.css есть класс .placeholder, но его изменение ни к чему не приводит. искал по файлам, думал где то в js зарыто, но так и не нашел. А цвет то где то все равно должен определяться.

Заранее благодарен.

14 комментариев

avatar
пожалуйста!

::-webkit-input-placeholder {
    color:    #999;
}
:-moz-placeholder,
::-moz-placeholder {
    color:    #999;
}
:-ms-input-placeholder {
    color:    #999;
}


правда заняло это у меня меньше минуты в гугле :) чес слово
avatar
просто я думал, что в лс уже где то определяются цвета. Что ж, надо было тогда отправить меня в гугл, нечего баловать) Спасибо
avatar
кстати вы проверяли? а то у меня чего то не того) не фурычит
avatar
должно фуричить :)

скорей всего не правильно используешь, так как это селекторы.

их нужно использовать, примерно так

.class::-webkit-input-placeholder {
    color:    #999;
}
.class:-moz-placeholder,
.class::-moz-placeholder {
    color:    #999;
}
.class:-ms-input-placeholder {
    color:    #999;
}

или

#id::-webkit-input-placeholder {
    color:    #999;
}
#id:-moz-placeholder,
#id::-moz-placeholder {
    color:    #999;
}
#id:-ms-input-placeholder {
    color:    #999;
}
avatar
ну вот делаю так:
#nav .search-header .search-header-form .input-submit::-webkit-input-placeholder  { color: #c3e7f8; }
#nav .search-header .search-header-form .input-submit:-moz-placeholder  { color: #c3e7f8; }


эффекта нет.
Делал и так:
input::-webkit-input-placeholder  { color: blue; }
input:-moz-placeholder  { color: blue; }

как kerby написал. Но тоже не дает эффекта. Что то мне кажется какой то подвох тут присутствует.
avatar
тем более что вот
/* Placeholder */
:-moz-placeholder { color: #aaa; }
.placeholder { color: #aaa; }


Как я уже писал в топике, изменение этих цветов ничего не дает
avatar
!important жмакните :)
avatar 
input::-webkit-input-placeholder  { color: blue; }
input:-moz-placeholder  { color: blue; }

Источник
avatar
Класс .placeholder — для старых версий IE (эмуляция плейсхолдера)
Изменение цвета :-moz-placeholder должно работать — jsfiddle.net/n2TN8/
для вебкита уже отписали — ::-webkit-input-placeholder
avatar
Мда… опера 12.10, все уже перепробывал, никаких изменений со стороны placeholder не наблюдается. Шаблон synio, если что, и да — кэши отключены и почищены и все такое. Не впервой.
avatar
Опера не поддерживает стилизацию плейсхолдеров.
avatar
вот оно что.
avatar
решил проблему по-другому.
Есть решение от девелоперов оперы, но оно кривое. Вот неплохой вариант, и компактно, и работает корректно. Правда смысл тут в том, что мы не меняем стиль плейсхолдера, но по-крайней мере он становится такого же цвета, как текст инпута, а это уже почти решение.

<script language='JavaScript' type="text/javascript"> 
			function clear_field(field)
			{
				if (field.value==field.defaultValue)
				{
					field.value=''
				}
			}
			function check_field(field)
			{
				if (field.value=='' ||
				field.value==' ')
				{
					field.value=field.defaultValue
				}
			}
		</script>


в инпуте 
<input type="text" maxlength="255" name="q" class="input-text" value="{$aLang.search}" onFocus='clear_field(this)' onBlur='check_field(this)'>
avatar
немного неудобно, постоянно писать onfocus, onblur, можно скриптом брать значение из плейсхолдера, вставлять в value, и опять же скриптом отрабатывать onfocus, onblur
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.