How to change color of placeholder with css

<input type="text">

All CSS not showing in online page, but show on view source with css link.

input[type=text]::-webkit-input-placeholder { /* Chrome and Safari */
  color: #f14512;
  opacity: 1;
}

input[type=text]::-moz-placeholder { /* Firefox */
  color: #f14512;
  opacity: 1;
}

input[type=text]:-ms-input-placeholder { /* IE */
  color: #f14512;
  opacity: 1;
}

input[type=text]::placeholder {
  color: #f14512;
  opacity: 1;
}

<input type="text" placeholder="placeholder color" class="form-control red-placeholder">

Create placeholder class for use everywhere.

.red-placeholder::-webkit-input-placeholder {
  color: #f14512;
  opacity: 1;
}

.red-placeholder::-moz-placeholder {
  color: #f14512;
  opacity: 1;
}

.red-placeholder:-ms-input-placeholder {
  color: #f14512;
  opacity: 1;
}

.red-placeholder::placeholder {
  color: #f14512;
  opacity: 1;
}

Code show like this:

Browser Support

The <input type=”text” placeholder=”placeholder color”> attribute is not supported in IE 9 or earlier versions.

Placeholder for IE jQuery

Placeholder for IE you can see reference site HTML5 Placeholder jQuery Plugin

---

or here you can try

First you need to download placeholder jquery click this link.

Use code like this:

<script src="js/jquery.placeholder.js"></script>
<script>
$('input, textarea').placeholder();
</script>

What is placeholder attribute

placeholder attribute gives a help to see what text need to be write. when user enter any keyword the placeholder text will be hide.