すべてのテキストボックスプレースホルダにスタイルを与える方法

Question

すべてのテキストボックスプレースホルダを選択して一般的なスタイルにしたいと思います。 何私が考えている：

 <style> 
     .textbox > placeholder 
     { 
     font-size: 15pt; 
     } 

     </style> 

Answer 1

このトリックを使用してください。

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

<input type="text" placeholder="this is the placeholder text"/>

Answer 2

クロスブラウザコード：

.textbox::-webkit-input-placeholder { 
 
    color: red; 
 
} 
 

 
.textbox:-moz-placeholder { /* Firefox 18- */ 
 
    color: red; 
 
} 
 

 
.textbox::-moz-placeholder { /* Firefox 19+ */ 
 
    color: red; 
 
} 
 

 
.textbox:-ms-input-placeholder { 
 
    color: red; 
 
}

<input type="text" class="textbox" placeholder="I am placeholder" style="width: 200px;" />

Answer 3

この

Jsfiddle

input::-webkit-input-placeholder { 
    color: red; 
} 

012をお試しください

詳細についてはhttps://css-tricks.com/snippets/css/style-placeholder-text/

Answer 4

このリンクをご確認ください： https://davidwalsh.name/html5-placeholder-cssを、

例：

/* for all */ 
::-webkit-input-placeholder { color:#f00; } 
::-moz-placeholder { color:#f00; } /* firefox 19+ */ 
:-ms-input-placeholder { color:#f00; } /* ie */ 
input:-moz-placeholder { color:#f00; } 

/* field is id, individual: webkit */ 
#field2::-webkit-input-placeholder { color:#00f; } 
#field3::-webkit-input-placeholder { color:#090; background:lightgreen; text-transform:uppercase; } 
#field4::-webkit-input-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999; } 

/* individual: mozilla */ 
#field2::-moz-placeholder { color:#00f; } 
#field3::-moz-placeholder { color:#090; background:lightgreen; text-transform:uppercase; } 
#field4::-moz-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3p