2013-12-16 3 views
2

Возможно ли использовать текстовое преобразование CSS для заполнителя ввода? Я пробовал псевдо элементы:Входной текст-преобразование текста-преобразования CSS

.user_info input ::-webkit-input-placeholder { /* WebKit browsers */ 
text-transform:none; 
} 
.user_info input :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
text-transform:none; 
} 
.user_info input::-moz-placeholder { /* Mozilla Firefox 19+ */ 
text-transform:none; 
} 
.user_info input:-ms-input-placeholder { /* Internet Explorer 10+ */ 
text-transform:none; 
} 

Но кажется, что он работает только в Mozilla. Может быть, вы знаете какие-нибудь обходные пути?

+0

взгляните на это, что будет работать и для Chrome, но для IE это не сработает, и вам, вероятно, понадобится сделать что-то js для его реализации самостоятельно: http://davidwalsh.name/html5-placeholder -css – Aram

+1

Он также работает в Chrome, но вам нужно удалить пробел между '.user_info input' и' :: - webkit-input-placeholder' - http: // jsfiddl e.net/t5SU6/ - не уверен в IE. – Adrift

+0

Ваш код работает и в хром. Вы уверены, что используете его правильно? – Vector

ответ

1

Это как самозагрузка обрабатывает его (и работает хорошо для меня на моих целях и испытаниях):

.form-control:-moz-placeholder { 
    color: #999999; 
} 
.form-control::-moz-placeholder { 
    color: #999999; 
    opacity: 1; 
} 
.form-control:-ms-input-placeholder { 
    color: #999999; 
} 
.form-control::-webkit-input-placeholder { 
    color: #999999; 
} 

У вас есть вопросы синтаксиса, что @Adrift отметил, здесь рекомендуются исправить: input.user_info::-webkit-input-placeholder {