HTML5 Form Text Placeholder - Есть ли у них псевдокласс CSS? - PullRequest
Новая
       5

HTML5 Form Text Placeholder - Есть ли у них псевдокласс CSS?

6 голосов
/ 01 февраля 2011

Читая статью о HTML5, мне приходит в голову, что, хотя заполнители невероятно полезны для удобства использования форм, если они не могут быть нацелены на CSS без JavaScript, они действительно являются маленьким шагом.

Так можно ли нацеливать заполнитель в CSS так, чтобы он отличался от введенного текста?

Ответы [ 2 ]

6 голосов
/ 01 февраля 2011

Webkit использует псевдоэлемент :: - webkit-input-placeholder.Moz использует псевдокласс: -moz-placeholder.

2 голосов
/ 29 мая 2017

enter image description here Я полагаю, у вас есть что-то подобное в вашем HTML 

<input type="text" name="name" />

Соответствующий CSS будет 

input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: blue;
}
input::-moz-placeholder { /* Firefox 19+ */
  color: blue;
}
input:-ms-input-placeholder { /* IE 10+ */
  color: blue;
}
input:-moz-placeholder { /* Firefox 18- */
  color: blue;
}
input:placeholder { 
  color: blue;
}

Я также призываю васвзглянем на 

input:placeholder-shown {
  border: 5px solid red;
}

Это хороший ресурс .

...